first commit

iadmin/themes/new-theme/bundle.js

@@ -0,0 +1,24 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */

iadmin/themes/new-theme/css/module/drop.css

@@ -0,0 +1,27 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+.modal-content {
+    padding: 1%;
+}

iadmin/themes/new-theme/css/right-sidebar.css

@@ -0,0 +1,127 @@
+#right-sidebar {
+  background: white;
+  float: right;
+  position: fixed;
+  display: block;
+  top: 136px;
+  bottom: 0px;
+  z-index: 1000;
+  overflow: auto;
+  right: -3em;
+  padding: 0 3em 0 0;
+  box-shadow: 0 0 12px rgba(0,0,0,0.8);
+}
+
+/*right sidebar is untested */
+.sidebar.sidebar-right.sidebar-xs-show {
+  right: 0;
+  -webkit-transform: translate(0,0);
+  -ms-transform: translate(0,0);
+  -o-transform: translate(0,0);
+  -moz-transform: translate(0,0);
+  transform: translate(0,0);
+}
+
+@media (min-width: 768px) {
+  /*right sidebar is untested */
+  .sidebar.sidebar-right.sidebar-sm-show {
+    right: 0;
+    -webkit-transform: translate(0,0);
+    -ms-transform: translate(0,0);
+    -o-transform: translate(0,0);
+    -moz-transform: translate(0,0);
+    transform: translate(0,0);
+  }
+}
+
+@media (min-width: 992px) {
+  .sidebar.sidebar-right.sidebar-md-show {
+    right: 0;
+    -webkit-transform: translate(0,0);
+    -ms-transform: translate(0,0);
+    -o-transform: translate(0,0);
+    -moz-transform: translate(0,0);
+    transform: translate(0,0);
+  }
+}
+
+@media (min-width: 1170px) {
+  .sidebar.sidebar-right.sidebar-lg-show {
+    right: 0;
+    -webkit-transform: translate(0,0);
+    -moz-transform: translate(0,0);
+    -ms-transform: translate(0,0);
+    -o-transform: translate(0,0);
+    transform: translate(0,0);
+  }
+}
+
+/* animation class - optional: without it the sidebar would just pop in and out*/
+.sidebar-animate {
+  -webkit-transition: -webkit-transform 300ms ease;
+  -moz-transition: -moz-transform 300ms ease;
+  -o-transition: transform 300ms ease;
+  transition: transform 300ms ease;
+}
+
+.sidebar.sidebar-right {
+  -webkit-transform: translate(100%,0);
+  -moz-transform: translate(100%,0);
+  -ms-transform: translate(100%,0);
+  -o-transform: translate(100%,0);
+  transform: translate(100%,0);
+}
+
+.sidebar.sidebar-right.sidebar-open {
+  -webkit-transform: translate(0,0);
+  -moz-transform: translate(0,0);
+  -ms-transform: translate(0,0);
+  -o-transform: translate(0,0);
+  transform: translate(0,0);
+}
+
+#right-sidebar .quicknav-container {
+  height: 100%;
+}
+
+.sidebar.sidebar-right .quicknav-fixed-bottom {
+  bottom: 0;
+  margin-bottom: 0;
+  position: fixed;
+  left: 0;
+  right: 3em;
+  height: 50px;
+}
+
+.sidebar.sidebar-right .quicknav-fixed-bottom ul.pagination {
+  margin-top: 0.5em;
+  margin-bottom: 0.5em;
+}
+
+.sidebar.sidebar-right .quicknav-fixed-bottom input {
+  outline-style: none;
+  text-align: center;
+}
+
+.sidebar.sidebar-right .quicknav-header {
+  background: #363A41;
+  color: #fff;
+  padding: 1.2em;
+  height: 50px;
+}
+
+.sidebar.sidebar-right .quicknav-header h2{
+  color: #fff;
+  margin-bottom: 0;
+}
+
+.sidebar.sidebar-right .quicknav-scroller {
+  overflow: auto;
+  height: calc(100% - 50px - 50px);
+}
+
+.sidebar.sidebar-right .quicknav-scroller table {
+  margin-bottom: 0;
+}
+
+

iadmin/themes/new-theme/js/app/.eslintrc.json

@@ -0,0 +1,42 @@
+{
+  "extends": "airbnb-base",
+  "env": {
+    "browser": true
+  },
+  "plugins": [
+    "import",
+    "html"
+  ],
+  "settings": {
+  "import/resolver": {
+    "webpack": {
+      "config": "../../webpack.config.js"
+      }
+    }
+  },
+  "rules": {
+    "import/extensions": [
+      "error",
+      "always",
+      {
+        "js": "never",
+        "vue": "never"
+      }
+    ],
+    "no-param-reassign": [
+      "error",
+      {
+        "props": false
+      }
+    ],
+    "no-underscore-dangle": "off",
+    "no-trailing-spaces": [
+      "error",
+      {
+        "skipBlankLines": true
+      }
+    ],
+    "class-methods-use-this": "off",
+    "no-unused-vars": "warn"
+  }
+}

iadmin/themes/new-theme/js/app/pages/catalog/index.js

@@ -0,0 +1,33 @@
+/*
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *
+ */
+
+import TableSorting from '../../utils/table-sorting';
+
+const $ = global.$;
+
+$(() => {
+  new TableSorting($('table.table')).attach();
+});

iadmin/themes/new-theme/js/app/pages/module-card/index.js

@@ -0,0 +1,32 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+import ModuleCard from '../../../components/module-card';
+
+const $ = global.$;
+
+$(() => {
+  new ModuleCard().init();
+});

iadmin/themes/new-theme/js/app/pages/stock/components/app.vue

@@ -0,0 +1,118 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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';
+
+  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.fetch();
+      },
+      applyFilter(filters) {
+        this.filters = filters;
+        this.fetch();
+      },
+      resetFilters() {
+        this.filters = {};
+      },
+      onLowStockChecked(isChecked) {
+        this.filters = Object.assign({}, this.filters, {
+          low_stock: isChecked,
+        });
+        this.fetch();
+      },
+    },
+    components: {
+      StockHeader,
+      Search,
+      PSPagination,
+      LowFilter,
+    },
+    data: () => ({
+      filters: {},
+    }),
+  };
+</script>
+
+<style lang="sass" type="text/scss">
+  // hide the layout header
+  #main-div > .header-toolbar {
+    height: 0;
+    display: none;
+  }
+</style>

iadmin/themes/new-theme/js/app/pages/stock/components/header/breadcrumb.vue

@@ -0,0 +1,56 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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>

iadmin/themes/new-theme/js/app/pages/stock/components/header/filters.vue

@@ -0,0 +1,207 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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>

iadmin/themes/new-theme/js/app/pages/stock/components/header/filters/filter-component.vue

@@ -0,0 +1,188 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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>

iadmin/themes/new-theme/js/app/pages/stock/components/header/filters/low-filter.vue

@@ -0,0 +1,84 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+
+<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>

iadmin/themes/new-theme/js/app/pages/stock/components/header/search.vue

@@ -0,0 +1,115 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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>

iadmin/themes/new-theme/js/app/pages/stock/components/header/stock-header.vue

@@ -0,0 +1,67 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+
+<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>

iadmin/themes/new-theme/js/app/pages/stock/components/header/tabs.vue

@@ -0,0 +1,49 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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>

iadmin/themes/new-theme/js/app/pages/stock/components/movements/index.vue

@@ -0,0 +1,128 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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>

iadmin/themes/new-theme/js/app/pages/stock/components/movements/movement-line.vue

@@ -0,0 +1,92 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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>

iadmin/themes/new-theme/js/app/pages/stock/components/overview/index.vue

@@ -0,0 +1,65 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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>

iadmin/themes/new-theme/js/app/pages/stock/components/overview/movement-type.vue

@@ -0,0 +1,73 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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="sass" scoped>
+  @import "../../../../../../scss/config/_settings.scss";
+  .update-qty {
+    color: white;
+    transition: background-color 0.2s ease;
+  }
+</style>

iadmin/themes/new-theme/js/app/pages/stock/components/overview/product-line.vue

@@ -0,0 +1,174 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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 Spinner from './spinner';
+  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 _ 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>

iadmin/themes/new-theme/js/app/pages/stock/components/overview/products-actions.vue

@@ -0,0 +1,147 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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>

iadmin/themes/new-theme/js/app/pages/stock/components/overview/products-table.vue

@@ -0,0 +1,129 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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>

iadmin/themes/new-theme/js/app/pages/stock/components/overview/spinner.vue

@@ -0,0 +1,151 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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 = 0;
+        }
+        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="sass" 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>

iadmin/themes/new-theme/js/app/pages/stock/index.js

@@ -0,0 +1,42 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+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');
+  },
+});

iadmin/themes/new-theme/js/app/pages/stock/mixins/product-desc.js

@@ -0,0 +1,48 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+export default {
+  computed: {
+    thumbnail() {
+      if (this.product.combination_thumbnail !== 'N/A') {
+        return `${window.data.baseUrl}/${this.product.combination_thumbnail}`;
+      } else if (this.product.product_thumbnail !== 'N/A') {
+        return `${window.data.baseUrl}/${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;
+    },
+  },
+};

iadmin/themes/new-theme/js/app/pages/stock/mixins/translate.js

@@ -0,0 +1,31 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+export default {
+  methods: {
+    trans(key) {
+      return this.$store.state.translations[key];
+    },
+  },
+};

iadmin/themes/new-theme/js/app/pages/stock/router/index.js

@@ -0,0 +1,50 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+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,
+    },
+  ],
+});

iadmin/themes/new-theme/js/app/pages/stock/store/actions.js

@@ -0,0 +1,190 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import Vue from 'vue';
+import VueResource from 'vue-resource';
+import * as types from './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);
+};

iadmin/themes/new-theme/js/app/pages/stock/store/index.js

@@ -0,0 +1,95 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+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,
+});

iadmin/themes/new-theme/js/app/pages/stock/store/mutation-types.js

@@ -0,0 +1,45 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+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';

iadmin/themes/new-theme/js/app/pages/stock/store/mutations.js

@@ -0,0 +1,185 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+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);
+  },
+};
+

iadmin/themes/new-theme/js/app/pages/translations/components/app.vue

@@ -0,0 +1,157 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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 './header/translations-header';
+  import Search from './header/search';
+  import Sidebar from './sidebar';
+  import Principal from './principal';
+  import PSModal from 'app/widgets/ps-modal';
+  import { EventBus } from 'app/utils/event-bus';
+
+
+  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="sass" 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>

iadmin/themes/new-theme/js/app/pages/translations/components/header/breadcrumb.vue

@@ -0,0 +1,45 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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>

iadmin/themes/new-theme/js/app/pages/translations/components/header/search.vue

@@ -0,0 +1,72 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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>

iadmin/themes/new-theme/js/app/pages/translations/components/header/translations-header.vue

@@ -0,0 +1,63 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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>

iadmin/themes/new-theme/js/app/pages/translations/components/principal/index.vue

@@ -0,0 +1,282 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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
+          && this.currentDomainTotalMissingTranslations === 1
+        ) {
+          totalMissingTranslationsString = this.trans('label_missing_singular');
+        } else if (this.currentDomainTotalMissingTranslations) {
+          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() {
+        return (this.$store.state.totalTranslations <= 1) ? this.trans('search_info_singular').replace('%s', this.$store.getters.searchTags.join(' - ')).replace('%d', this.$store.state.totalTranslations) : this.trans('search_info').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 {Integer} 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 = [];
+        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: window.data.selected,
+          });
+        });
+
+        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="sass" 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>

iadmin/themes/new-theme/js/app/pages/translations/components/principal/translation-input.vue

@@ -0,0 +1,99 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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="sass" scoped>
+  @import "../../../../../../scss/config/_settings.scss";
+
+  .form-group {
+    overflow: hidden;
+  }
+  .missing {
+    border: 1px solid $danger;
+  }
+</style>

iadmin/themes/new-theme/js/app/pages/translations/components/sidebar/index.vue

@@ -0,0 +1,222 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<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="sass" 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>

iadmin/themes/new-theme/js/app/pages/translations/index.js

@@ -0,0 +1,42 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+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');
+  },
+});

iadmin/themes/new-theme/js/app/pages/translations/mixins/translate.js

@@ -0,0 +1,31 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+export default {
+  methods: {
+    trans(key) {
+      return this.$store.getters.translations[key];
+    },
+  },
+};

iadmin/themes/new-theme/js/app/pages/translations/router/index.js

@@ -0,0 +1,41 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+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,
+    },
+  ],
+});

iadmin/themes/new-theme/js/app/pages/translations/store/actions.js

@@ -0,0 +1,143 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import Vue from 'vue';
+import VueResource from 'vue-resource';
+import * as types from './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);
+};

iadmin/themes/new-theme/js/app/pages/translations/store/index.js

@@ -0,0 +1,108 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+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,
+});

iadmin/themes/new-theme/js/app/pages/translations/store/mutation-types.js

@@ -0,0 +1,35 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+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';

iadmin/themes/new-theme/js/app/pages/translations/store/mutations.js

@@ -0,0 +1,69 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+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;
+  },
+};

iadmin/themes/new-theme/js/app/store/index.js

@@ -0,0 +1,49 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import Vue from 'vue';
+import Vuex from 'vuex';
+
+Vue.use(Vuex);
+
+// root state object.
+
+const state = {
+
+};
+
+// getters are functions
+const getters = {
+
+};
+
+// A Vuex instance is created by combining the state, mutations, actions,
+// and getters.
+export default new Vuex.Store({
+  state,
+  getters,
+  modules: {
+
+  }
+});

iadmin/themes/new-theme/js/app/test/unit/index.js

@@ -0,0 +1,11 @@
+/* eslint-disable */
+import Vue from 'vue';
+
+Vue.config.productionTip = false;
+
+// require all test files (files that ends with .spec.js)
+var testsContext = require.context('./specs', true, /\.spec$/);
+testsContext.keys().forEach(testsContext);
+
+const srcContext = require.context('../../pages/', true, /^\.\/(?!main(\.js)?$)/);
+srcContext.keys().forEach(srcContext);

iadmin/themes/new-theme/js/app/test/unit/karma.conf.js

@@ -0,0 +1,86 @@
+/* eslint-disable */
+// Karma configuration
+// Generated on Fri May 19 2017 10:32:08 GMT+0200 (CEST)
+
+var webpackConfig = require('../../../../webpack.config.js');
+
+module.exports = function(config) {
+  config.set({
+
+    // base path that will be used to resolve all patterns (eg. files, exclude)
+    basePath: '.',
+
+
+    // frameworks to use
+    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
+    frameworks: ['mocha', 'sinon-chai', 'chai-jquery', 'chai', 'jquery-1.8.3'],
+
+
+    // list of files / patterns to load in the browser
+    files: [
+      './index.js',
+    ],
+
+
+    // list of files to exclude
+    exclude: [
+      'node_modules',
+    ],
+
+
+    // preprocess matching files before serving them to the browser
+    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
+    preprocessors: {
+      './index.js': ['webpack', 'babel', 'coverage'],
+    },
+
+    webpack: webpackConfig,
+
+    webpackMiddleware: {
+      noInfo: true,
+    },
+
+    // test results reporter to use
+    // possible values: 'dots', 'progress'
+    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
+    reporters: ['spec'],
+
+
+    // web server port
+    port: 9876,
+
+
+    // enable / disable colors in the output (reporters and logs)
+    colors: true,
+
+
+    // level of logging
+    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
+    logLevel: config.LOG_INFO,
+
+
+    // enable / disable watching file and executing tests whenever any file changes
+    autoWatch: true,
+
+
+    // start these browsers
+    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
+    browsers: ['Chrome'],
+
+
+    // Continuous Integration mode
+    // if true, Karma captures browsers, runs the tests and exits
+    singleRun: false,
+
+    // Concurrency level
+    // how many browser should be started simultaneous
+    concurrency: Infinity,
+
+    coverageReporter: {
+      dir: './coverage',
+      reporters: [
+        {type: 'html', dir:'./coverage'},
+      ]
+    }
+  })
+}

iadmin/themes/new-theme/js/app/test/unit/specs/stock/App.spec.js

@@ -0,0 +1,118 @@
+/* eslint-disable */
+
+import Vue from 'vue';
+import Vuex from 'vuex';
+import VueRouter from 'vue-router'
+import Translation from 'app/pages/stock/mixins/translate';
+import App from 'app/pages/stock/components/app.vue';
+
+Vue.use(Vuex);
+Vue.use(VueRouter);
+Vue.mixin(Translation);
+
+let router = new VueRouter({path: 'overview'})
+const PAGE_COUNT_MOCK = 2;
+const PAGINATION_INDEX_MOCK = 1;
+
+const mockedStore = {
+  state: {
+    isReady: true,
+    translations: {},
+    movementsTypes: [],
+    categories: [],
+    suppliers: [],
+    totalPages: PAGE_COUNT_MOCK,
+    pageIndex: PAGINATION_INDEX_MOCK,
+  },
+  getters: {
+    suppliers: () => {
+      return [];
+    },
+    categories: () => {
+      return [];
+    },
+  },
+  actions: {
+    getSuppliers() {
+
+    },
+    getCategories() {
+
+    },
+    isLoading() {
+
+    },
+    getMovements() {
+
+    }
+  }
+}
+
+window.data = {
+  catalogUrl: ''
+}
+
+$.fn.datetimepicker = function() {
+  return {
+    on: function() {
+
+    }
+  }
+};
+
+
+describe('app.vue', () => {
+
+  const Constructor = Vue.extend(App);
+  var vm = new Constructor({
+    store: new Vuex.Store(mockedStore),
+    router
+  }).$mount();
+
+  it('should exist', () => {
+    expect(vm.$el).to.exist;
+  });
+
+  it('should have stock app class', function () {
+    $(vm.$el).should.have.class('stock-app');
+  });
+
+  it('should not display app when translations are not loaded', function () {
+    mockedStore.state.isReady = false;
+    vm = new Constructor({
+      store: new Vuex.Store(mockedStore),
+      router
+    }).$mount();
+    $(vm.$el).should.not.have.class('stock-app');
+  });
+
+  it('should have a data property called filters', function () {
+    expect(App.data().filters).to.exist;
+  });
+
+  it('should have 3 children components', function () {
+    expect(App.components.StockHeader).to.exist;
+    expect(App.components.Search).to.exist;
+    expect(App.components.PSPagination).to.exist;
+  });
+
+  it('should have a computed property isReady', function () {
+    expect(vm.isReady).to.be.false;
+  });
+
+  it('should have a computed property pagesCount', function () {
+    expect(vm.pagesCount).to.equal(PAGE_COUNT_MOCK);
+  });
+
+  it('should have a computed property currentPagination', function () {
+    expect(vm.currentPagination).to.equal(PAGINATION_INDEX_MOCK);
+  });
+
+  it('should have a method fetch which call actions', function () {
+    var spy = sinon.spy(vm.$store, 'dispatch');
+    vm.fetch();
+    assert(spy.calledWith('isLoading'));
+    assert(spy.calledWith('getMovements'));
+    spy.restore();
+  });
+});

iadmin/themes/new-theme/js/app/utils/datepicker.js

@@ -0,0 +1,39 @@
+/**
+ * 2007-2017 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2017 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import 'url-polyfill';
+
+const $ = global.$;
+
+/**
+ * Enable all datepickers.
+ */
+const init = function initDatePickers() {
+  $('.datepicker input[type="text"]').datetimepicker({
+    locale: global.full_language_code,
+    format: 'YYYY-MM-DD',
+  });
+};
+
+export default init;

iadmin/themes/new-theme/js/app/utils/event-bus.js

@@ -0,0 +1,26 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import Vue from 'vue';
+export const EventBus = new Vue();

iadmin/themes/new-theme/js/app/utils/growl.js

@@ -0,0 +1,32 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+export function showGrowl(type, message) {
+  window.$.growl[type]({
+    title: '',
+    size: "large",
+    message: message,
+    duration: 1000
+  });
+};

iadmin/themes/new-theme/js/app/utils/reset_search.js

@@ -0,0 +1,36 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+/**
+ * Send a Post Request to reset search Action.
+ */
+
+const $ = global.$;
+
+const init = function resetSearch(url, redirectUrl) {
+    $.post(url).then(() => window.location.assign(redirectUrl));
+};
+
+export default init;

iadmin/themes/new-theme/js/app/utils/serp/index.js

@@ -0,0 +1,93 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import Vue from 'vue';
+import serp from './serp';
+const $ = window.$;
+
+/**
+ * Vue component displaying a search page result, Google style.
+ * Requires a tag with the id "#serp-app" to be present in the DOM to run it.
+ * The component is automatically updated by watching several inputs.
+ * Set the proper class to link a input to a part of the panel.
+ */
+class SerpApp {
+  constructor() {
+    // If the selector cannot be found, we do not load the Vue app
+    if (0 === $('#serp-app').length) {
+      return;
+    }
+
+    this.defaultTitle = $('.serp-default-title:input');
+    this.watchedTitle = $('.serp-watched-title:input');
+    this.defaultDescription = $('.serp-default-description');
+    this.watchedDescription = $('.serp-watched-description');
+    this.defaultUrl = $('.serp-default-url:input');
+
+    this.vm = new Vue({
+      el: '#serp-app',
+      template: '<serp ref="serp" />',
+      components: { serp },
+    });
+
+    this.attachEvents(this.vm.$refs.serp);
+  }
+    
+  attachEvents(app) {
+    // Specific rules for updating the search result preview
+    const updateSerpTitle = () => {
+      const title1 = this.watchedTitle.length ? this.watchedTitle.val() : '';
+      const title2 = this.defaultTitle.length ? this.defaultTitle.val() : '';
+      app.setTitle(title1 || title2);
+    };
+    const updateSerpUrl = () => {
+      if (this.defaultUrl.length) {
+        app.setUrl(this.defaultUrl.val());
+      }
+    };
+    const updateSerpDescription = () => {
+      const desc1 = this.watchedDescription.length ? $(this.watchedDescription.val()).text() || this.watchedDescription.val() : '';
+      const desc2 = this.defaultDescription.length ? $(this.defaultDescription.val()).text() || this.defaultDescription.val() : '';
+      app.setDescription(desc1 || desc2);
+    };
+    this.watchedTitle.on('keyup change', updateSerpTitle);
+    this.defaultTitle.on('keyup change', updateSerpTitle);
+
+    this.watchedDescription.on('keyup change', updateSerpDescription);
+    this.defaultDescription.on('keyup change', updateSerpDescription);
+
+    updateSerpTitle();
+    updateSerpUrl();
+    updateSerpDescription();
+  }
+
+  /**
+   * @returns {boolean}
+   */
+  isActive() {
+    return (undefined !== this.vm);
+  }
+}
+
+export default SerpApp;

iadmin/themes/new-theme/js/app/utils/serp/serp.vue

@@ -0,0 +1,147 @@
+
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<template>
+  <div id="serp"">
+    <div class="serp-preview">
+      <div class="serp-title">{{title}}</div>
+      <div class="serp-url">{{url}}<span class="serp-arrow"></span></div>
+      <div class="serp-description">{{description}}</div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'serp',
+    props: {
+        title: {
+          type: String,
+          default: '',
+        },
+        url: {
+          type: String,
+          default: 'http://example.com/',
+        },
+        description: {
+          type: String,
+          default: '',
+        },
+    },
+    methods: {
+        setTitle(title) {
+            if(title.length > 70) {
+                title = title.substring(0, 70) + ' ...';
+            }
+            this.title = title;
+        },
+        setUrl(url) {
+            this.url = url;
+        },
+        setDescription(description) {
+            if(description.length > 150) {
+                description = description.substring(0, 150) + ' ...';
+            }
+            this.description = description;
+        }
+    }
+  };
+</script>
+
+<style lang="sass" type="text/scss" scoped>
+    .serp-preview {
+        margin-top: 15px;
+        margin-bottom: 15px;
+        border-radius: 2px;
+        box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.12);
+        background-color: #ffffff;
+        border: solid 1px #e7e7e7;
+        padding: 30px;
+        max-width: 700px;
+
+        .serp-arrow {
+            border-bottom-color: rgb(0, 102, 33);
+            border-bottom-style: solid;
+            border-bottom-width: 0px;
+            border-left-color: rgba(0, 0, 0, 0);
+            border-left-style: solid;
+            border-left-width: 4px;
+            border-right-color: rgba(0, 0, 0, 0);
+            border-right-style: solid;
+            border-right-width: 4px;
+            border-top-color: rgb(0, 102, 33);
+            border-top-style: solid;
+            border-top-width: 5px;
+            color: rgb(128, 128, 128);
+            cursor: default;
+            font-family: arial, sans-serif;
+            font-size: 11px;
+            font-weight: bold;
+            height: 0px;
+            position: absolute;
+            line-height: 27px;
+            margin-left: 3px;
+            margin-top: 6px;
+            text-align: center;
+            user-select: none;
+            visibility: visible;
+            white-space: nowrap;
+            width: 0px;
+        }
+
+        .serp-title {
+            color: #1A0DAB;
+            cursor: pointer;
+            font-family: arial, regular;
+            font-size: 18px;
+            font-weight: normal;
+            text-align: left;
+            text-decoration: none;
+            visibility: visible;
+            white-space: nowrap;
+        }
+
+        .serp-url {
+            color: #006621;
+            font-family: arial, regular;
+            font-size: 14px;
+            font-style: normal;
+            font-weight: normal;
+            line-height: 24px;
+            text-align: left;
+            visibility: visible;
+        }
+
+        .serp-description {
+            color: #545454;
+            font-family: arial, regular;
+            font-size: 13px;
+            font-weight: normal;
+            text-align: left;
+            visibility: visible;
+            word-wrap: break-word;
+        }
+    }
+</style>

iadmin/themes/new-theme/js/app/utils/sql-manager.js

@@ -0,0 +1,79 @@
+/**
+ * 2007-2017 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2017 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+const $ = global.$;
+
+/**
+ * Allow to display the last SQL query in a modal and redirect to SQL Manager.
+ */
+class SqlManager {
+  showLastSqlQuery() {
+    $('#catalog_sql_query_modal_content textarea[name="sql"]').val($('tbody.sql-manager').data('query'));
+    $('#catalog_sql_query_modal .btn-sql-submit').click(() => {
+      $('#catalog_sql_query_modal_content').submit();
+    });
+    $('#catalog_sql_query_modal').modal('show');
+  }
+
+  sendLastSqlQuery(name) {
+    $('#catalog_sql_query_modal_content textarea[name="sql"]').val($('tbody.sql-manager').data('query'));
+    $('#catalog_sql_query_modal_content input[name="name"]').val(name);
+    $('#catalog_sql_query_modal_content').submit();
+  }
+
+  createSqlQueryName() {
+    let container = false;
+    let current = false;
+    if ($('.breadcrumb')) {
+      container = $('.breadcrumb li').eq(0).text().replace(/\s+/g, ' ').trim();
+      current = $('.breadcrumb li').eq(-1).text().replace(/\s+/g, ' ').trim();
+    }
+    let title = false;
+    if ($('h2.title')) {
+      title = $('h2.title').first().text().replace(/\s+/g, ' ').trim();
+    }
+
+    let name = false;
+    if (container && current && container != current) {
+      name = container + ' > ' + current;
+    } else if (container) {
+      name = container;
+    } else if (current) {
+      name = current;
+    }
+
+    if (title && title != current && title != container) {
+      if (name) {
+        name = name + ' > ' + title;
+      } else {
+        name = title;
+      }
+    }
+
+    return name.trim();
+  }
+}
+
+export default SqlManager;

iadmin/themes/new-theme/js/app/utils/table-sorting.js

@@ -0,0 +1,104 @@
+/**
+ * 2007-2017 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2017 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+const $ = global.$;
+
+/**
+ * Makes a table sortable by columns.
+ * This forces a page reload with more query parameters.
+ */
+class TableSorting {
+
+  /**
+   * @param {jQuery} table
+   */
+  constructor(table) {
+    this.selector = '.ps-sortable-column';
+    this.columns = $(table).find(this.selector);
+  }
+
+  /**
+   * Attaches the listeners
+   */
+  attach() {
+    this.columns.on('click', (e) => {
+      const $column = $(e.delegateTarget);
+      this._sortByColumn($column, this._getToggledSortDirection($column));
+    });
+  }
+
+  /**
+   * Sort using a column name
+   * @param {string} columnName
+   * @param {string} direction "asc" or "desc"
+   */
+  sortBy(columnName, direction) {
+    const $column = this.columns.is(`[data-sort-col-name="${columnName}"]`);
+    if (!$column) {
+      throw new Error(`Cannot sort by "${columnName}": invalid column`);
+    }
+
+    this._sortByColumn($column, direction);
+  }
+
+  /**
+   * Sort using a column element
+   * @param {jQuery} column
+   * @param {string} direction "asc" or "desc"
+   * @private
+   */
+  _sortByColumn(column, direction) {
+    window.location = this._getUrl(column.data('sortColName'), (direction === 'desc') ? 'desc' : 'asc');
+  }
+
+  /**
+   * Returns the inverted direction to sort according to the column's current one
+   * @param {jQuery} column
+   * @return {string}
+   * @private
+   */
+  _getToggledSortDirection(column) {
+    return column.data('sortDirection') === 'asc' ? 'desc' : 'asc';
+  }
+
+  /**
+   * Returns the url for the sorted table
+   * @param {string} colName
+   * @param {string} direction
+   * @return {string}
+   * @private
+   */
+  _getUrl(colName, direction) {
+    const url = new URL(window.location.href);
+    const params = url.searchParams;
+
+    params.set('orderBy', colName);
+    params.set('sortOrder', direction);
+
+    return url.toString();
+  }
+}
+
+export default TableSorting;

iadmin/themes/new-theme/js/app/widgets/ps-alert.vue

@@ -0,0 +1,74 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<template>
+  <div class="ps-alert alert" :class="classObject" role="alert">
+    <button
+      v-if="hasClose"
+      type="button"
+      class="close"
+      data-dismiss="alert"
+      aria-label="Close"
+      @click.stop="onClick"
+    >
+      <span class="material-icons">close</span>
+    </button>
+    <p class="alert-text">
+      <slot />
+    </p>
+  </div>
+</template>
+
+<script>
+  const ALERT_TYPE_INFO = 'ALERT_TYPE_INFO';
+  const ALERT_TYPE_WARNING = 'ALERT_TYPE_WARNING';
+  const ALERT_TYPE_DANGER = 'ALERT_TYPE_DANGER';
+  const ALERT_TYPE_SUCCESS = 'ALERT_TYPE_SUCCESS';
+
+  export default {
+    props: {
+      duration: false,
+      alertType: { type: String, required: true },
+      hasClose: { type: Boolean, required: true },
+    },
+    computed: {
+      classObject() {
+        return {
+          'alert-info': this.alertType === ALERT_TYPE_INFO,
+          'alert-warning': this.alertType === ALERT_TYPE_WARNING,
+          'alert-danger': this.alertType === ALERT_TYPE_DANGER,
+          'alert-success': this.alertType === ALERT_TYPE_SUCCESS,
+        };
+      },
+      isInfo() {
+        return this.alertType === ALERT_TYPE_INFO;
+      },
+    },
+    methods: {
+      onClick() {
+        this.$emit('closeAlert');
+      },
+    },
+  };
+</script>

iadmin/themes/new-theme/js/app/widgets/ps-button.vue

@@ -0,0 +1,58 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<template>
+  <button type="button" class="btn" :class="classObject" @click="onClick" >
+    <slot />
+  </button>
+</template>
+
+<script>
+ export default {
+   props: {
+     primary: { type: Boolean },
+     ghost: { type: Boolean },
+   },
+   computed: {
+     classObject() {
+       if (this.ghost) {
+         return {
+           'btn-outline-primary': this.primary,
+           'btn-outline-secondary': !this.primary,
+         };
+       }
+
+       return {
+         'btn-primary': this.primary,
+         'btn-secondary': !this.primary,
+       };
+     },
+   },
+   methods: {
+     onClick() {
+       this.$emit('click');
+     },
+   },
+ };
+</script>

iadmin/themes/new-theme/js/app/widgets/ps-checkbox.vue

@@ -0,0 +1,63 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<template>
+  <div class="md-checkbox">
+    <label>
+      <input type="checkbox" :id="id" v-model="checked" :class="{'indeterminate' : isIndeterminate }">
+      <i class="md-checkbox-control"></i>
+      <slot name="label"></slot>
+    </label>
+  </div>
+</template>
+
+<script>
+  export default {
+    props: {
+      id: {
+        type: String,
+      },
+      model: {
+        type: Object,
+        required: false,
+      },
+      isIndeterminate: {
+        type: Boolean,
+        required: false,
+        default: false,
+      },
+    },
+    watch: {
+      checked(val) {
+        this.$emit('checked', {
+          checked: val,
+          item: this.model,
+        });
+      },
+    },
+    data: () => ({
+      checked: false,
+    }),
+  };
+</script>

iadmin/themes/new-theme/js/app/widgets/ps-datepicker.vue

@@ -0,0 +1,84 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<template>
+  <div class="input-group date">
+    <input ref="datepicker" type="text" class="form-control" />
+    <div class="input-group-append">
+      <span class="input-group-text">
+        <i class="material-icons">event</i>
+      </span>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    props: {
+      locale: {
+        type: String,
+        required: true,
+        default: 'en',
+      },
+      type: {
+        type: String,
+        required: true,
+      },
+    },
+    mounted() {
+      $(this.$refs.datepicker).datetimepicker({
+        format: 'YYYY-MM-DD',
+        showClear: true,
+      }).on('dp.change', (infos) => {
+        infos.dateType = this.type;
+        this.$emit(
+          infos.date ? 'dpChange' : 'reset',
+          infos,
+        );
+      });
+    },
+  };
+</script>
+
+<style lang="sass">
+  @import "../../../scss/config/_settings.scss";
+
+  .date {
+    a[data-action='clear']::before {
+      font-family: 'Material Icons';
+      content: "\E14C";
+      font-size: 20px;
+      position: absolute;
+      bottom: 15px;
+      left: 50%;
+      margin-left: -10px;
+      color: $gray-dark;
+      cursor:pointer;
+    }
+    .bootstrap-datetimepicker-widget tr td span:hover {
+      background-color: white;
+    }
+  }
+
+</style>

iadmin/themes/new-theme/js/app/widgets/ps-loader.vue

@@ -0,0 +1,70 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<template>
+  <div class="ps-loader">
+    <div class="timeline-item">
+      <div class="animated-background">
+        <slot />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    props: ['thumb'],
+  };
+</script>
+<style lang="sass" scoped>
+  @import "../../../scss/config/_settings.scss";
+  .ps-loader {
+    width: 100%;
+    .animated-background {
+        animation-duration: 1s;
+        animation-iteration-count: infinite;
+        animation-name: loading;
+        animation-timing-function: linear;
+        background: $gray-soft;
+        background: linear-gradient(to right, $gray-soft 8%, #ccc 18%, $gray-soft 33%);
+        background-size: 100%;
+        height: 40px;
+        position: relative;
+    }
+
+    .background-masker {
+      background: white;
+      position: absolute;
+    }
+  }
+
+  @keyframes loading{
+    0%{
+        background-position: -500px 0
+    }
+    100%{
+        background-position: 500px 0
+    }
+  }
+</style>

iadmin/themes/new-theme/js/app/widgets/ps-media.vue

@@ -0,0 +1,69 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<template>
+  <div class="media">
+    <img v-if="displayThumb" :src="thumbnail" class="thumbnail d-flex"  />
+    <div v-else class="no-img"></div>
+    <div class="ml-2 desc media-body">
+      <slot />
+    </div>
+  </div>
+</template>
+<script>
+  export default {
+    props: ['thumbnail'],
+    computed: {
+      displayThumb() {
+        return !!this.thumbnail;
+      },
+    },
+  };
+</script>
+
+<style lang="sass" scoped>
+  @import "../../../scss/config/_settings.scss";
+  .product-title {
+    .has-combination & {
+      font-weight: 600;
+    }
+  }
+  .thumbnail, .no-img {
+      border: $gray-light 1px solid;
+      max-width: 47px;
+  }
+  .no-img {
+    background: white;
+    width: 47px;
+    height: 47px;
+    display: inline-block;
+    vertical-align: middle;
+  }
+  .desc {
+    white-space: normal;
+  }
+  small {
+    color: $gray-medium;
+  }
+</style>

iadmin/themes/new-theme/js/app/widgets/ps-modal.vue

@@ -0,0 +1,97 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<template>
+  <div class="modal fade" id="ps-modal" tabindex="-1" role="dialog">
+      <div class="modal-dialog" role="document">
+          <div class="modal-content">
+            <div class="modal-header">
+                <button type="button" class="close" data-dismiss="modal">
+                    <i class="material-icons">close</i>
+                </button>
+                <h4 class="modal-title">{{translations.modal_title}}</h4>
+            </div>
+            <div class="modal-body">
+              {{translations.modal_content}}
+            </div>
+            <div class="modal-footer">
+                <PSButton @click="onSave" class="btn-lg" primary data-dismiss="modal">{{translations.button_save}}</PSButton>
+                <PSButton @click="onLeave" class="btn-lg" ghost data-dismiss="modal">{{translations.button_leave}}</PSButton>
+            </div>
+          </div>
+      </div>
+  </div>
+</template>
+
+<script>
+import PSButton from 'app/widgets/ps-button';
+import { EventBus } from 'app/utils/event-bus';
+
+export default {
+  props: {
+    translations: {
+      type: Object,
+      required: false,
+    },
+  },
+  mounted() {
+    EventBus.$on('showModal', () => {
+      this.showModal();
+    });
+    EventBus.$on('hideModal', () => {
+      this.hideModal();
+    });
+  },
+  methods: {
+    showModal() {
+      $(this.$el).modal('show');
+    },
+    hideModal() {
+      $(this.$el).modal('hide');
+    },
+    onSave() {
+      this.$emit('save');
+    },
+    onLeave() {
+      this.$emit('leave');
+    },
+  },
+  components: {
+    PSButton,
+  },
+};
+
+</script>
+
+<style lang="sass" scoped>
+   @import "../../../scss/config/_settings.scss";
+  .modal-header .close {
+    font-size: 1.2rem;
+    color: $gray-medium;
+    opacity: 1;
+  }
+  .modal-content {
+    border-radius: 0
+  }
+</style>

iadmin/themes/new-theme/js/app/widgets/ps-number.vue

@@ -0,0 +1,72 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+
+ <template>
+  <div class="ps-number" :class="{'hover-buttons': hoverButtons}">
+    <input
+      type="number"
+      class="form-control"
+      :class="{'danger': danger}"
+      :value="value"
+      @keyup="onKeyup($event)"
+      @focus="focusIn"
+      @blur.native="focusOut($event)"
+    />
+    <div class="ps-number-spinner d-flex" v-if="buttons">
+      <span class="ps-number-up" @click="increment"></span>
+      <span class="ps-number-down" @click="decrement"></span>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    props: {
+      value: 0,
+      danger: false,
+      buttons: false,
+      hoverButtons: false,
+    },
+    methods: {
+      onKeyup($event) {
+        this.$emit('keyup', $event);
+      },
+      focusIn() {
+        this.$emit('focus');
+      },
+      focusOut($event) {
+        this.$emit('blur', $event);
+      },
+      increment() {
+        const value = parseInt(this.value, 10);
+        this.$emit('change', isNaN(value) ? 0 : value + 1);
+      },
+      decrement() {
+        const value = parseInt(this.value, 10);
+        this.$emit('change', isNaN(value) ? -1 : value - 1);
+      },
+    },
+  };
+</script>

iadmin/themes/new-theme/js/app/widgets/ps-pagination.vue

@@ -0,0 +1,125 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<template>
+  <nav class="mt-1 mx-auto" v-if="displayPagination">
+    <ul class="pagination" :class="{'multi':isMultiPagination}">
+      <li v-if="isMultiPagination" class="page-item previous">
+        <a v-show="activeLeftArrow" class="float-left page-link" @click="prev($event)" href="#">
+          <span class="sr-only">Previous</span>
+        </a>
+      </li>
+      <li class="page-item" :class="{'active' : checkCurrentIndex(index)}" v-for="index in pagesCount">
+        <a
+          v-if="showIndex(index)"
+          class="page-link"
+          :class="{
+            'pl-0' : showFirstDots(index),
+            'pr-0' : showLastDots(index)
+          }"
+          @click.prevent="changePage(index)"
+          href="#"
+          >
+          <span v-if="isMultiPagination" v-show="showFirstDots(index)">...</span>
+          {{ index }}
+          <span v-if="isMultiPagination" v-show="showLastDots(index)">...</span>
+        </a>
+      </li>
+      <li v-if="isMultiPagination" class="page-item next">
+        <a v-show="activeRightArrow" class="float-left page-link" @click="next($event)" href="#">
+          <span class="sr-only">Next</span>
+        </a>
+      </li>
+    </ul>
+  </nav>
+</template>
+
+<script>
+  export default {
+    props: ['pagesCount', 'currentIndex'],
+    computed: {
+      isMultiPagination() {
+        return this.pagesCount > this.multiPagesActivationLimit;
+      },
+      activeLeftArrow() {
+        return this.currentIndex !== 1;
+      },
+      activeRightArrow() {
+        return this.currentIndex !== this.pagesCount;
+      },
+      pagesToDisplay() {
+        return this.multiPagesToDisplay;
+      },
+      displayPagination() {
+        return this.pagesCount > 1;
+      },
+    },
+    methods: {
+      checkCurrentIndex(index) {
+        return this.currentIndex === index;
+      },
+      showIndex(index) {
+        const startPaginationIndex = index < this.currentIndex + this.multiPagesToDisplay;
+        const lastPaginationIndex = index > this.currentIndex - this.multiPagesToDisplay;
+        const indexToDisplay = startPaginationIndex && lastPaginationIndex;
+        const lastIndex = index === this.pagesCount;
+        const firstIndex = index === 1;
+        if (!this.isMultiPagination) {
+          return !this.isMultiPagination;
+        }
+        return indexToDisplay || firstIndex || lastIndex;
+      },
+      changePage(pageIndex) {
+        this.$emit('pageChanged', pageIndex);
+      },
+      showFirstDots(index) {
+        const pagesToDisplay = this.pagesCount - this.multiPagesToDisplay;
+        if (!this.isMultiPagination) {
+          return this.isMultiPagination;
+        }
+        return index === this.pagesCount && this.currentIndex <= pagesToDisplay;
+      },
+      showLastDots(index) {
+        if (!this.isMultiPagination) {
+          return this.isMultiPagination;
+        }
+        return index === 1 && this.currentIndex > this.multiPagesToDisplay;
+      },
+      prev() {
+        if (this.currentIndex > 1) {
+          this.changePage(this.currentIndex - 1);
+        }
+      },
+      next() {
+        if (this.currentIndex < this.pagesCount) {
+          this.changePage(this.currentIndex + 1);
+        }
+      },
+    },
+    data: () => ({
+      multiPagesToDisplay: 2,
+      multiPagesActivationLimit: 5,
+    }),
+  };
+</script>

iadmin/themes/new-theme/js/app/widgets/ps-radio.vue

@@ -0,0 +1,47 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+
+<template>
+  <div class="ps-radio">
+    <input type="radio" :id="id" name="radio-group" :checked="checked" @change="onChange">
+    <label :for="id">{{label}}</label>
+  </div>
+</template>
+
+<script>
+  export default{
+    props: {
+      id: { type: String, required: true },
+      label: { type: String, required: false },
+      checked: { type: Boolean, required: false },
+      value: { type: String, required: false },
+    },
+    methods: {
+      onChange() {
+        this.$emit('change', this.value);
+      },
+    },
+  };
+</script>

iadmin/themes/new-theme/js/app/widgets/ps-select.vue

@@ -0,0 +1,74 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<template>
+  <div class="ps-select">
+    <select class="form-control" v-model="selected" @change="onChange">
+      <option value="default" selected>
+        <slot />
+      </option>
+      <option
+        v-for="item in items"
+        :value="item[itemID]"
+      >
+        {{item[itemName]}}
+      </option>
+    </select>
+  </div>
+</template>
+
+<script>
+  export default {
+    props: ['items', 'itemID', 'itemName'],
+    methods: {
+      onChange() {
+        this.$emit('change', {
+          value: this.selected,
+          itemID: this.itemID,
+        });
+      },
+    },
+    data: () => ({ selected: 'default' }),
+  };
+</script>
+
+<style lang="sass" scoped>
+  @import "../../../scss/config/_settings.scss";
+  .ps-select {
+    position: relative;
+    select {
+      appearance: none;
+      border-radius: 0;
+    }
+    &::after {
+      content: "\E313";
+      font-family: 'Material Icons';
+      color: $gray-medium;
+      font-size: 20px;
+      position: absolute;
+      right: 5px;
+      top: 5px;
+    }
+  }
+</style>

iadmin/themes/new-theme/js/app/widgets/ps-spinner.vue

@@ -0,0 +1,27 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<template>
+  <div class="ps-spinner"></div>
+</template>

iadmin/themes/new-theme/js/app/widgets/ps-table/ps-sort.vue

@@ -0,0 +1,57 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<template>
+  <div class="ps-sortable-column" data-sort-col-name="id_product" :data-sort-is-current="isCurrent" :data-sort-direction="sortDirection" @click="sortToggle">
+    <span role="columnheader"><slot /></span>
+    <span role="button" class="ps-sort" aria-label="Tri"></span>
+  </div>
+</template>
+
+<script>
+  export default {
+    props: {
+      // column name
+      order: String,
+      // indicates the currently sorted column in the table
+      currentSort: String,
+    },
+    methods: {
+      sortToggle() {
+        // toggle direction
+        this.sortDirection = (this.sortDirection === 'asc') ? 'desc' : 'asc';
+        this.$emit('sort', this.order, this.sortDirection);
+      },
+    },
+    data: () => ({
+      sortDirection: 'asc',
+    }),
+    computed: {
+      isCurrent() {
+        return this.currentSort === this.order;
+      },
+    },
+  };
+</script>
+

iadmin/themes/new-theme/js/app/widgets/ps-table/ps-table.vue

@@ -0,0 +1,31 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<template>
+  <div class="table-responsive">
+    <table class="table">
+      <slot />
+    </table>
+  </div>
+</template>

iadmin/themes/new-theme/js/app/widgets/ps-tags.vue

@@ -0,0 +1,86 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<template>
+  <div class="tags-input search-input search d-flex flex-wrap" :class="{ 'search-with-icon': hasIcon }" @click="focus()">
+    <div class="tags-wrapper">
+      <span v-for="(tag, index) in tags" class="tag">{{ tag }}<i class="material-icons" @click="close(index)">close</i></span>
+    </div>
+    <input
+      ref = "tags"
+      :placeholder="placeholderToDisplay"
+      type="text"
+      v-model="tag"
+      class="form-control input"
+      @keyup="onKeyUp"
+      @keydown.enter="add(tag)"
+      @keydown.delete.stop="remove()"
+      :size="inputSize"
+    />
+  </div>
+</template>
+
+<script>
+
+  export default {
+    props: ['tags', 'placeholder', 'hasIcon'],
+    computed: {
+      inputSize() {
+        return !this.tags.length && this.placeholder ? this.placeholder.length : 0;
+      },
+      placeholderToDisplay() {
+        return this.tags.length ? '' : this.placeholder;
+      },
+    },
+    methods: {
+      onKeyUp() {
+        this.$emit('typing', this.$refs.tags.value);
+      },
+      add(tag) {
+        if (tag) {
+          this.tags.push(tag.trim());
+          this.tag = '';
+          this.focus();
+          this.$emit('tagChange', this.tag);
+        }
+      },
+      close(index) {
+        const tagName = this.tags[index];
+        this.tags.splice(index, 1);
+        this.$emit('tagChange', tagName);
+      },
+      remove() {
+        if (this.tags.length && !this.tag.length) {
+          const tagName = this.tags[this.tags.length - 1];
+          this.tags.pop();
+          this.$emit('tagChange', tagName);
+        }
+      },
+      focus() {
+        this.$refs.tags.focus();
+      },
+    },
+    data: () => ({ tag: null }),
+  };
+</script>

iadmin/themes/new-theme/js/app/widgets/ps-tree/ps-tree-item.vue

@@ -0,0 +1,157 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<template>
+  <div class="ps-tree-items" :class="{className}">
+    <div class="d-flex tree-name" :class="{active: active, disable: model.disable}" @click="clickElement">
+      <button class="btn btn-text" :class="[{hidden: isHidden}, chevronStatus]">
+        <span v-if="translations" class="sr-only">{{this.model.open ? translations.reduce : translations.expand}}</span>
+      </button>
+      <PSCheckbox :ref="model.name" :id="id" :model="model" @checked="onCheck" v-if="hasCheckbox"/>
+      <span class="tree-label" :class="{warning: isWarning}">{{model.name}}</span>
+      <span class="tree-extra-label d-sm-none d-xl-inline-block" v-if="displayExtraLabel">{{getExtraLabel}}</span>
+      <span class="tree-extra-label-mini d-xl-none" v-if="displayExtraLabel">{{this.model.extraLabel}}</span>
+    </div>
+    <ul v-show="open" v-if="isFolder" class="tree">
+      <li v-for="(element, index) in model.children" class="tree-item" :class="{disable: model.disable}">
+        <PSTreeItem
+          :ref="element.id"
+          :class="className"
+          :hasCheckbox="hasCheckbox"
+          :model="element"
+          :label="element.name"
+          :translations="translations"
+          :currentItem="currentItem"
+          @checked="onCheck"
+          @setCurrentElement ="setCurrentElement"
+        />
+      </li>
+    </ul>
+  </div>
+</template>
+
+<script>
+  import PSCheckbox from 'app/widgets/ps-checkbox';
+  import { EventBus } from 'app/utils/event-bus';
+
+  export default {
+    name: 'PSTreeItem',
+    props: {
+      model: { type: Object, required: true },
+      className: { type: String, required: false },
+      hasCheckbox: { type: Boolean, required: false },
+      translations: { type: Object, required: false },
+      currentItem: { type: String, required: false },
+    },
+    computed: {
+      id() {
+        return this.model.id;
+      },
+      isFolder() {
+        return this.model.children && this.model.children.length;
+      },
+      displayExtraLabel() {
+        return this.isFolder && this.model.extraLabel;
+      },
+      getExtraLabel() {
+        let extraLabel = '';
+
+        if (this.model.extraLabel && this.model.extraLabel === 1) {
+          extraLabel = this.translations.extra_singular;
+        } else if (this.model.extraLabel) {
+          extraLabel = this.translations.extra.replace('%d', this.model.extraLabel);
+        }
+
+        return extraLabel;
+      },
+      isHidden() {
+        return !this.isFolder;
+      },
+      chevronStatus() {
+        return this.open? 'open' : 'closed';
+      },
+      isWarning() {
+        return !this.isFolder && this.model.warning;
+      },
+      active() {
+        return this.model.full_name === this.currentItem;
+      },
+    },
+    methods: {
+      setCurrentElement(el) {
+        if (this.$refs[el]) {
+          this.openTreeItemAction();
+          this.current = true;
+          this.parentElement(this.$parent);
+        } else {
+          this.current = false;
+        }
+      },
+      parentElement(parent) {
+        if (parent.clickElement) {
+          parent.clickElement();
+          this.parentElement(parent.$parent);
+        }
+      },
+      clickElement() {
+        return !this.model.disable ? this.openTreeItemAction() : false;
+      },
+      openTreeItemAction() {
+        this.setCurrentElement(this.model.full_name);
+        if (this.isFolder) {
+          this.open = !this.open;
+        } else {
+          EventBus.$emit('lastTreeItemClick', {
+            item: this.model,
+          });
+        }
+      },
+      onCheck(obj) {
+        this.$emit('checked', obj);
+      },
+    },
+    mounted() {
+      EventBus.$on('toggleCheckbox', (tag) => {
+        const checkbox = this.$refs[tag];
+        if (checkbox) {
+          checkbox.$data.checked = !checkbox.$data.checked;
+        }
+      }).$on('expand', () => {
+        this.open = true;
+      }).$on('reduce', () => {
+        this.open = false;
+      }).$on('setCurrentElement', (el) => {
+        this.setCurrentElement(el);
+      });
+      this.setCurrentElement(this.currentItem);
+    },
+    components: {
+      PSCheckbox,
+    },
+    data: () => ({
+      open: false,
+      current: false,
+    }),
+  };
+</script>

iadmin/themes/new-theme/js/app/widgets/ps-tree/ps-tree.vue

@@ -0,0 +1,88 @@
+<!--**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ *-->
+<template>
+  <div class="ps-tree">
+    <div class="mb-3 tree-header">
+      <button class="btn btn-text text-uppercase pointer" @click="expand">
+        <i class="material-icons">keyboard_arrow_down</i>
+        <span v-if="translations">{{translations.expand}}</span>
+      </button>
+      <button class="btn btn-text float-right text-uppercase pointer" @click="reduce">
+        <i class="material-icons">keyboard_arrow_up</i>
+        <span v-if="translations">{{translations.reduce}}</span>
+      </button>
+    </div>
+    <ul class="tree" :class="className">
+      <li v-for="(element, index) in model">
+        <PSTreeItem
+          ref="item"
+          :hasCheckbox="hasCheckbox"
+          :model="element"
+          :label="element.name"
+          :translations="translations"
+          :currentItem="currentItem"
+          @checked="onCheck"
+          @setCurrentElement ="setCurrentElement"
+        />
+      </li>
+    </ul>
+  </div>
+</template>
+
+<script>
+  import PSTreeItem from './ps-tree-item';
+  import { EventBus } from 'app/utils/event-bus';
+
+  export default {
+    name: 'PSTree',
+    props: {
+      model: Array,
+      className: String,
+      currentItem: String,
+      hasCheckbox: Boolean,
+      translations: {
+        type: Object,
+        required: false,
+      },
+    },
+    methods: {
+      onCheck(obj) {
+        this.$emit('checked', obj);
+      },
+      expand() {
+        EventBus.$emit('expand');
+      },
+      reduce() {
+        EventBus.$emit('reduce');
+      },
+      setCurrentElement(id) {
+        EventBus.$emit('setCurrentElement', id);
+      },
+    },
+    components: {
+      PSTreeItem,
+    },
+  };
+</script>

iadmin/themes/new-theme/js/clickable-dropdown.js

@@ -0,0 +1,46 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+/**
+ * By default, bootstrap dropdowns close down when the user clicks anywhere.
+ * This plugin allows clicking inside the dropdown menu while keeping it open.
+ * In order to make a dropdown behave like this, simply add the class "dropdown-clickable" to its parent element.
+ */
+(($) => {
+
+  $.fn.clickableDropdown = function clickableDropdown() {
+
+    $(document).on('click', '.dropdown-clickable .dropdown-menu', (e) => {
+      e.stopPropagation();
+    });
+
+    return this;
+  };
+
+  // hook up the plugin
+  $(function initClickableDropdown() {
+    $(document).clickableDropdown();
+  });
+})(window.$);

iadmin/themes/new-theme/js/components/choice-table.js

@@ -0,0 +1,52 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+const $ = window.$;
+
+/**
+ * ChoiceTable is responsible for managing common actions in choice table form type
+ */
+export default class ChoiceTable {
+  /**
+   * Init constructor
+   */
+  constructor() {
+    $(document).on('change', '.js-choice-table-select-all', (e) => {
+      this.handleSelectAll(e);
+    });
+  }
+
+  /**
+   * Check/uncheck all boxes in table
+   *
+   * @param {Event} event
+   */
+  handleSelectAll(event) {
+    const $selectAllCheckboxes = $(event.target);
+    const isSelectAllChecked = $selectAllCheckboxes.is(':checked');
+
+    $selectAllCheckboxes.closest('table').find('tbody input:checkbox').prop('checked', isSelectAllChecked);
+  }
+}

iadmin/themes/new-theme/js/components/grid/extension/action/row/submit-row-action-extension.js

@@ -0,0 +1,67 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+const $ = window.$;
+
+/**
+ * Class SubmitRowActionExtension handles submitting of row action
+ */
+export default class SubmitRowActionExtension {
+  /**
+   * Extend grid
+   *
+   * @param {Grid} grid
+   */
+  extend(grid) {
+    grid.getContainer().on('click', '.js-submit-row-action', (event) => {
+      event.preventDefault();
+
+      const $button = $(event.currentTarget);
+      const confirmMessage = $button.data('confirm-message');
+
+      if (confirmMessage.length && !confirm(confirmMessage)) {
+        return;
+      }
+
+      const method = $button.data('method');
+      const isGetOrPostMethod = ['GET', 'POST'].includes(method);
+
+      const $form = $('<form>', {
+        'action': $button.data('url'),
+        'method': isGetOrPostMethod ? method : 'POST',
+      }).appendTo('body');
+
+      if (!isGetOrPostMethod) {
+        $form.append($('<input>', {
+          'type': '_hidden',
+          'name': '_method',
+          'value': method
+        }));
+      }
+
+      $form.submit();
+    });
+  }
+}

iadmin/themes/new-theme/js/components/grid/extension/bulk-action-checkbox-extension.js

@@ -0,0 +1,104 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+const $ = window.$;
+
+/**
+ * Class BulkActionSelectCheckboxExtension
+ */
+export default class BulkActionCheckboxExtension {
+  /**
+   * Extend grid with bulk action checkboxes handling functionality
+   *
+   * @param {Grid} grid
+   */
+  extend(grid) {
+    this._handleBulkActionCheckboxSelect(grid);
+    this._handleBulkActionSelectAllCheckbox(grid);
+  }
+
+  /**
+   * Handles "Select all" button in the grid
+   *
+   * @param {Grid} grid
+   *
+   * @private
+   */
+  _handleBulkActionSelectAllCheckbox(grid) {
+    grid.getContainer().on('change', '.js-bulk-action-select-all', (e) => {
+      const $checkbox = $(e.currentTarget);
+
+      const isChecked = $checkbox.is(':checked');
+      if (isChecked) {
+        this._enableBulkActionsBtn(grid);
+      } else {
+        this._disableBulkActionsBtn(grid);
+      }
+
+      grid.getContainer().find('.js-bulk-action-checkbox').prop('checked', isChecked);
+    });
+  }
+
+  /**
+   * Handles each bulk action checkbox select in the grid
+   *
+   * @param {Grid} grid
+   *
+   * @private
+   */
+  _handleBulkActionCheckboxSelect(grid) {
+    grid.getContainer().on('change', '.js-bulk-action-checkbox', () => {
+      const checkedRowsCount = grid.getContainer().find('.js-bulk-action-checkbox:checked').length;
+
+      if (checkedRowsCount > 0) {
+        this._enableBulkActionsBtn(grid);
+      } else {
+        this._disableBulkActionsBtn(grid);
+      }
+    });
+  }
+
+  /**
+   * Enable bulk actions button
+   *
+   * @param {Grid} grid
+   *
+   * @private
+   */
+  _enableBulkActionsBtn(grid) {
+    grid.getContainer().find('.js-bulk-actions-btn').prop('disabled', false);
+  }
+
+  /**
+   * Disable bulk actions button
+   *
+   * @param {Grid} grid
+   *
+   * @private
+   */
+  _disableBulkActionsBtn(grid) {
+    grid.getContainer().find('.js-bulk-actions-btn').prop('disabled', true);
+  }
+}

iadmin/themes/new-theme/js/components/grid/extension/column-toggling-extension.js

@@ -0,0 +1,70 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+const $ = global.$;
+
+/**
+ * Class ReloadListExtension extends grid with "Column toggling" feature
+ */
+export default class ColumnTogglingExtension {
+
+  /**
+   * Extend grid
+   *
+   * @param {Grid} grid
+   */
+  extend(grid) {
+    const $table = grid.getContainer().find('table.table');
+    $table.find('.ps-togglable-row').on('click', (e) => {
+      e.preventDefault();
+      this._toggleValue($(e.delegateTarget));
+    });
+  }
+
+  /**
+   * @param {jQuery} row
+   * @private
+   */
+  _toggleValue(row) {
+    const toggleUrl = row.data('toggleUrl');
+
+    this._submitAsForm(toggleUrl);
+  }
+
+  /**
+   * Submits request url as form
+   *
+   * @param {string} toggleUrl
+   * @private
+   */
+  _submitAsForm(toggleUrl) {
+    const $form = $('<form>', {
+      action: toggleUrl,
+      method: 'POST',
+    }).appendTo('body');
+
+    $form.submit();
+  }
+}

iadmin/themes/new-theme/js/components/grid/extension/export-to-sql-manager-extension.js

@@ -0,0 +1,116 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+const $ = window.$;
+
+/**
+ * Class ExportToSqlManagerExtension extends grid with exporting query to SQL Manager
+ */
+export default class ExportToSqlManagerExtension {
+  /**
+   * Extend grid
+   *
+   * @param {Grid} grid
+   */
+  extend(grid) {
+    grid.getContainer().on('click', '.js-common_show_query-grid-action', () => this._onShowSqlQueryClick(grid));
+    grid.getContainer().on('click', '.js-common_export_sql_manager-grid-action', () => this._onExportSqlManagerClick(grid));
+  }
+
+  /**
+   * Invoked when clicking on the "show sql query" toolbar button
+   *
+   * @param {Grid} grid
+   *
+   * @private
+   */
+  _onShowSqlQueryClick(grid) {
+    const $sqlManagerForm = $('#' + grid.getId() + '_common_show_query_modal_form');
+    this._fillExportForm($sqlManagerForm, grid);
+
+    const $modal = $('#' + grid.getId() + '_grid_common_show_query_modal');
+    $modal.modal('show');
+
+    $modal.on('click', '.btn-sql-submit', () => $sqlManagerForm.submit());
+  }
+
+  /**
+   * Invoked when clicking on the "export to the sql query" toolbar button
+   *
+   * @param {Grid} grid
+   *
+   * @private
+   */
+  _onExportSqlManagerClick(grid) {
+    const $sqlManagerForm = $('#' + grid.getId() + '_common_show_query_modal_form');
+
+    this._fillExportForm($sqlManagerForm, grid);
+
+    $sqlManagerForm.submit();
+  }
+
+  /**
+   * Fill export form with SQL and it's name
+   *
+   * @param {jQuery} $sqlManagerForm
+   * @param {Grid} grid
+   *
+   * @private
+   */
+  _fillExportForm($sqlManagerForm, grid) {
+    const query = grid.getContainer().find('.js-grid-table').data('query');
+
+    $sqlManagerForm.find('textarea[name="sql"]').val(query);
+    $sqlManagerForm.find('input[name="name"]').val(this._getNameFromBreadcrumb());
+  }
+
+  /**
+   * Get export name from page's breadcrumb
+   *
+   * @return {String}
+   *
+   * @private
+   */
+  _getNameFromBreadcrumb() {
+    const $breadcrumbs = $('.header-toolbar').find('.breadcrumb-item');
+    let name = '';
+
+    $breadcrumbs.each((i, item) => {
+      const $breadcrumb = $(item);
+
+      const breadcrumbTitle = 0 < $breadcrumb.find('a').length ?
+        $breadcrumb.find('a').text() :
+        $breadcrumb.text();
+
+      if (0 < name.length) {
+        name = name.concat(' > ');
+      }
+
+      name = name.concat(breadcrumbTitle);
+    });
+
+    return name;
+  }
+}

iadmin/themes/new-theme/js/components/grid/extension/filters-reset-extension.js

@@ -0,0 +1,45 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+import resetSearch from '../../../app/utils/reset_search';
+
+const $ = window.$;
+
+/**
+ * Class FiltersResetExtension extends grid with filters resetting
+ */
+export default class FiltersResetExtension {
+
+  /**
+   * Extend grid
+   *
+   * @param {Grid} grid
+   */
+  extend(grid) {
+    grid.getContainer().on('click', '.js-reset-search', (event) => {
+      resetSearch($(event.currentTarget).data('url'), $(event.currentTarget).data('redirect'));
+    });
+  }
+}

iadmin/themes/new-theme/js/components/grid/extension/link-row-action-extension.js

@@ -0,0 +1,46 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+const $ = window.$;
+
+/**
+ * Class LinkRowActionExtension handles link row actions
+ */
+export default class LinkRowActionExtension {
+  /**
+   * Extend grid
+   *
+   * @param {Grid} grid
+   */
+  extend(grid) {
+    grid.getContainer().on('click', '.js-link-row-action', (event) => {
+      const confirmMessage = $(event.currentTarget).data('confirm-message');
+
+      if (confirmMessage.length && !confirm(confirmMessage)) {
+        event.preventDefault();
+      }
+    });
+  }
+}

iadmin/themes/new-theme/js/components/grid/extension/position-extension.js

@@ -0,0 +1,175 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+import tableDnD from "tablednd/dist/jquery.tablednd.min";
+
+const $ = window.$;
+
+/**
+ * Class PositionExtension extends Grid with reorderable positions
+ */
+export default class PositionExtension {
+  constructor() {
+    return {
+      extend: (grid) => this.extend(grid),
+    }
+  }
+
+  /**
+   * Extend grid
+   *
+   * @param {Grid} grid
+   */
+  extend(grid) {
+    this.grid = grid;
+    this._addIdsToGridTableRows();
+    grid.getContainer().find('.js-grid-table').tableDnD({
+      onDragClass: 'position-row-while-drag',
+      dragHandle: '.js-drag-handle',
+      onDrop: (table, row) => this._handlePositionChange(row),
+    });
+    grid.getContainer().find('.js-drag-handle').hover(
+      function() {
+        $(this).closest('tr').addClass('hover');
+      },
+      function() {
+        $(this).closest('tr').removeClass('hover');
+      }
+    );
+  }
+
+  /**
+   * When position is changed handle update
+   *
+   * @param {HTMLElement} row
+   *
+   * @private
+   */
+  _handlePositionChange(row) {
+    const $rowPositionContainer = $(row).find('.js-' + this.grid.getId() + '-position:first');
+    const updateUrl = $rowPositionContainer.data('update-url');
+    const method = $rowPositionContainer.data('update-method');
+    const paginationOffset = parseInt($rowPositionContainer.data('pagination-offset'), 10);
+    const positions = this._getRowsPositions(paginationOffset);
+    const params = {positions};
+
+    this._updatePosition(updateUrl, params, method);
+  }
+
+  /**
+   * Returns the current table positions
+   * @returns {Array}
+   * @private
+   */
+  _getRowsPositions(paginationOffset) {
+    const tableData = JSON.parse($.tableDnD.jsonize());
+    const rowsData = tableData[this.grid.getId()+'_grid_table'];
+    const regex = /^row_(\d+)_(\d+)$/;
+
+    const rowsNb = rowsData.length;
+    const positions = [];
+    let rowData, i;
+    for (i = 0; i < rowsNb; ++i) {
+      rowData = regex.exec(rowsData[i]);
+      positions.push({
+        rowId: rowData[1],
+        newPosition: paginationOffset + i,
+        oldPosition: parseInt(rowData[2], 10),
+      });
+    }
+
+    return positions;
+  }
+
+  /**
+   * Add ID's to Grid table rows to make tableDnD.onDrop() function work.
+   *
+   * @private
+   */
+  _addIdsToGridTableRows() {
+    this.grid.getContainer()
+      .find('.js-grid-table .js-' + this.grid.getId() + '-position')
+      .each((index, positionWrapper) => {
+        const $positionWrapper = $(positionWrapper);
+        const rowId = $positionWrapper.data('id');
+        const position = $positionWrapper.data('position');
+        const id = `row_${rowId}_${position}`;
+        $positionWrapper.closest('tr').attr('id', id);
+        $positionWrapper.closest('td').addClass('js-drag-handle');
+      });
+  }
+
+  /**
+   * Process rows positions update
+   *
+   * @param {String} url
+   * @param {Object} params
+   * @param {String} method
+   *
+   * @private
+   */
+  _updatePosition(url, params, method) {
+    const isGetOrPostMethod = ['GET', 'POST'].includes(method);
+
+    const $form = $('<form>', {
+      'action': url,
+      'method': isGetOrPostMethod ? method : 'POST',
+    }).appendTo('body');
+
+    const positionsNb = params.positions.length;
+    let position;
+    for (let i = 0; i < positionsNb; ++i) {
+      position = params.positions[i];
+      $form.append(
+        $('<input>', {
+          'type': 'hidden',
+          'name': 'positions['+i+'][rowId]',
+          'value': position.rowId
+        }),
+        $('<input>', {
+          'type': 'hidden',
+          'name': 'positions['+i+'][oldPosition]',
+          'value': position.oldPosition
+        }),
+        $('<input>', {
+          'type': 'hidden',
+          'name': 'positions['+i+'][newPosition]',
+          'value': position.newPosition
+        })
+      );
+    }
+
+    // This _method param is used by Symfony to simulate DELETE and PUT methods
+    if (!isGetOrPostMethod) {
+      $form.append($('<input>', {
+        'type': 'hidden',
+        'name': '_method',
+        'value': method,
+      }));
+    }
+
+    $form.submit();
+  }
+}

iadmin/themes/new-theme/js/components/grid/extension/reload-list-extension.js

@@ -0,0 +1,40 @@
+/**
+* 2007-2018 PrestaShop
+*
+* 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.txt.
+* 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 http://www.prestashop.com for more information.
+*
+* @author    PrestaShop SA <contact@prestashop.com>
+* @copyright 2007-2018 PrestaShop SA
+* @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+* International Registered Trademark & Property of PrestaShop SA
+*/
+
+/**
+ * Class ReloadListExtension extends grid with "List reload" action
+ */
+export default class ReloadListExtension {
+  /**
+   * Extend grid
+   *
+   * @param {Grid} grid
+   */
+  extend(grid) {
+    grid.getContainer().on('click', '.js-common_refresh_list-grid-action', () => {
+      location.reload();
+    });
+  }
+}

iadmin/themes/new-theme/js/components/grid/extension/sorting-extension.js

@@ -0,0 +1,42 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+import TableSorting from '../../../app/utils/table-sorting';
+
+/**
+ * Class ReloadListExtension extends grid with "List reload" action
+ */
+export default class SortingExtension {
+  /**
+   * Extend grid
+   *
+   * @param {Grid} grid
+   */
+  extend(grid) {
+    const $sortableTable = grid.getContainer().find('table.table');
+
+    new TableSorting($sortableTable).attach();
+  }
+}

iadmin/themes/new-theme/js/components/grid/extension/submit-bulk-action-extension.js

@@ -0,0 +1,71 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+const $ = window.$;
+
+/**
+ * Handles submit of grid actions
+ */
+export default class SubmitBulkActionExtension {
+  constructor() {
+    return {
+      extend: (grid) => this.extend(grid),
+    };
+  }
+
+  /**
+   * Extend grid with bulk action submitting
+   *
+   * @param {Grid} grid
+   */
+  extend(grid) {
+    grid.getContainer().on('click', '.js-bulk-action-submit-btn', (event) => {
+      this.submit(event, grid);
+    });
+  }
+
+  /**
+   * Handle bulk action submitting
+   *
+   * @param {Event} event
+   * @param {Grid} grid
+   *
+   * @private
+   */
+  submit(event, grid) {
+    const $submitBtn = $(event.currentTarget);
+    const confirmMessage = $submitBtn.data('confirm-message');
+
+    if (typeof confirmMessage !== "undefined" && 0 < confirmMessage.length && !confirm(confirmMessage)) {
+      return;
+    }
+
+    const $form = $('#' + grid.getId() + '_filter_form');
+
+    $form.attr('action', $submitBtn.data('form-url'));
+    $form.attr('method', $submitBtn.data('form-method'));
+    $form.submit();
+  }
+}

iadmin/themes/new-theme/js/components/grid/extension/submit-grid-action-extension.js

@@ -0,0 +1,68 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+const $ = window.$;
+
+/**
+ * Class SubmitGridActionExtension handles grid action submits
+ */
+export default class SubmitGridActionExtension {
+  constructor() {
+    return {
+      extend: (grid) => this.extend(grid)
+    };
+  }
+
+  extend(grid) {
+    grid.getContainer().on('click', '.js-grid-action-submit-btn', (event) => {
+      this.handleSubmit(event, grid);
+    });
+  }
+
+  /**
+   * Handle grid action submit.
+   * It uses grid form to submit actions.
+   *
+   * @param {Event} event
+   * @param {Grid} grid
+   *
+   * @private
+   */
+  handleSubmit(event, grid) {
+    const $submitBtn = $(event.currentTarget);
+    const confirmMessage = $submitBtn.data('confirm-message');
+
+    if (typeof confirmMessage !== "undefined" && 0 < confirmMessage.length && !confirm(confirmMessage)) {
+        return;
+    }
+
+    const $form = $('#' + grid.getId() + '_filter_form');
+
+    $form.attr('action', $submitBtn.data('url'));
+    $form.attr('method', $submitBtn.data('method'));
+    $form.find('input[name="' + grid.getId() + '[_token]"]').val($submitBtn.data('csrf'));
+    $form.submit();
+  }
+}

iadmin/themes/new-theme/js/components/grid/grid.js

@@ -0,0 +1,68 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+const $ = window.$;
+
+/**
+ * Class is responsible for handling Grid events
+ */
+export default class Grid {
+  /**
+   * Grid id
+   *
+   * @param {string} id
+   */
+  constructor(id) {
+    this.id = id;
+    this.$container = $('#' + this.id + '_grid');
+  }
+
+  /**
+   * Get grid id
+   *
+   * @returns {string}
+   */
+  getId() {
+    return this.id;
+  }
+
+  /**
+   * Get grid container
+   *
+   * @returns {jQuery}
+   */
+  getContainer() {
+    return this.$container;
+  }
+
+  /**
+   * Extend grid with external extensions
+   *
+   * @param {object} extension
+   */
+  addExtension(extension) {
+    extension.extend(this);
+  }
+}

iadmin/themes/new-theme/js/components/module-card.js

@@ -0,0 +1,300 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+const $ = window.$;
+
+var BOEvent = {
+  on: function(eventName, callback, context) {
+
+    document.addEventListener(eventName, function(event) {
+      if (typeof context !== 'undefined') {
+        callback.call(context, event);
+      } else {
+        callback(event);
+      }
+    });
+  },
+
+  emitEvent: function(eventName, eventType) {
+    var _event = document.createEvent(eventType);
+    // true values stand for: can bubble, and is cancellable
+    _event.initEvent(eventName, true, true);
+    document.dispatchEvent(_event);
+  }
+};
+
+
+/**
+ * Class is responsible for handling Module Card behavior
+ *
+ * This is a port of admin-dev/themes/default/js/bundle/module/module_card.js
+ */
+export default class ModuleCard {
+
+  constructor() {
+    /* Selectors for module action links (uninstall, reset, etc...) to add a confirm popin */
+    this.moduleActionMenuLinkSelector = 'button.module_action_menu_';
+    this.moduleActionMenuInstallLinkSelector = 'button.module_action_menu_install';
+    this.moduleActionMenuEnableLinkSelector = 'button.module_action_menu_enable';
+    this.moduleActionMenuUninstallLinkSelector = 'button.module_action_menu_uninstall';
+    this.moduleActionMenuDisableLinkSelector = 'button.module_action_menu_disable';
+    this.moduleActionMenuEnableMobileLinkSelector = 'button.module_action_menu_enable_mobile';
+    this.moduleActionMenuDisableMobileLinkSelector = 'button.module_action_menu_disable_mobile';
+    this.moduleActionMenuResetLinkSelector = 'button.module_action_menu_reset';
+    this.moduleActionMenuUpdateLinkSelector = 'button.module_action_menu_upgrade';
+    this.moduleItemListSelector = '.module-item-list';
+    this.moduleItemGridSelector = '.module-item-grid';
+    this.moduleItemActionsSelector = '.module-actions';
+
+    /* Selectors only for modal buttons */
+    this.moduleActionModalDisableLinkSelector = 'a.module_action_modal_disable';
+    this.moduleActionModalResetLinkSelector = 'a.module_action_modal_reset';
+    this.moduleActionModalUninstallLinkSelector = 'a.module_action_modal_uninstall';
+    this.forceDeletionOption = '#force_deletion';
+
+    this.initActionButtons();
+  }
+
+  initActionButtons() {
+    const self = this;
+
+    $(document).on('click', this.forceDeletionOption, function () {
+      const btn = $(self.moduleActionModalUninstallLinkSelector, $("div.module-item-list[data-tech-name='" + $(this).attr("data-tech-name") + "']"));
+      if ($(this).prop('checked') === true) {
+        btn.attr('data-deletion', 'true');
+      } else {
+        btn.removeAttr('data-deletion');
+      }
+    });
+
+    $(document).on('click', this.moduleActionMenuInstallLinkSelector, function () {
+      if ($("#modal-prestatrust").length) {
+        $("#modal-prestatrust").modal('hide');
+      }
+      return self._dispatchPreEvent('install', this) && self._confirmAction('install', this) && self._requestToController('install', $(this));
+    });
+    $(document).on('click', this.moduleActionMenuEnableLinkSelector, function () {
+      return self._dispatchPreEvent('enable', this) && self._confirmAction('enable', this) && self._requestToController('enable', $(this));
+    });
+    $(document).on('click', this.moduleActionMenuUninstallLinkSelector, function () {
+      return self._dispatchPreEvent('uninstall', this) && self._confirmAction('uninstall', this) && self._requestToController('uninstall', $(this));
+    });
+    $(document).on('click', this.moduleActionMenuDisableLinkSelector, function () {
+      return self._dispatchPreEvent('disable', this) && self._confirmAction('disable', this) && self._requestToController('disable', $(this));
+    });
+    $(document).on('click', this.moduleActionMenuEnableMobileLinkSelector, function () {
+      return self._dispatchPreEvent('enable_mobile', this) && self._confirmAction('enable_mobile', this) && self._requestToController('enable_mobile', $(this));
+    });
+    $(document).on('click', this.moduleActionMenuDisableMobileLinkSelector, function () {
+      return self._dispatchPreEvent('disable_mobile', this) && self._confirmAction('disable_mobile', this) && self._requestToController('disable_mobile', $(this));
+    });
+    $(document).on('click', this.moduleActionMenuResetLinkSelector, function () {
+      return self._dispatchPreEvent('reset', this) && self._confirmAction('reset', this) && self._requestToController('reset', $(this));
+    });
+    $(document).on('click', this.moduleActionMenuUpdateLinkSelector, function () {
+      return self._dispatchPreEvent('update', this) && self._confirmAction('update', this) && self._requestToController('update', $(this));
+    });
+
+    $(document).on('click', this.moduleActionModalDisableLinkSelector, function () {
+      return self._requestToController('disable', $(self.moduleActionMenuDisableLinkSelector, $("div.module-item-list[data-tech-name='" + $(this).attr("data-tech-name") + "']")));
+    });
+    $(document).on('click', this.moduleActionModalResetLinkSelector, function () {
+      return self._requestToController('reset', $(self.moduleActionMenuResetLinkSelector, $("div.module-item-list[data-tech-name='" + $(this).attr("data-tech-name") + "']")));
+    });
+    $(document).on('click', this.moduleActionModalUninstallLinkSelector, function (e) {
+      $(e.target).parents('.modal').on('hidden.bs.modal', function(event) {
+        return self._requestToController(
+          'uninstall',
+          $(
+            self.moduleActionMenuUninstallLinkSelector,
+            $("div.module-item-list[data-tech-name='" + $(e.target).attr("data-tech-name") + "']")
+          ),
+          $(e.target).attr("data-deletion")
+        );
+      }.bind(e));
+    });
+  };
+
+  _getModuleItemSelector() {
+    if ($(this.moduleItemListSelector).length) {
+      return this.moduleItemListSelector;
+    } else {
+      return this.moduleItemGridSelector;
+    }
+  };
+
+  _confirmAction(action, element) {
+    var modal = $('#' + $(element).data('confirm_modal'));
+    if (modal.length != 1) {
+      return true;
+    }
+    modal.first().modal('show');
+
+    return false; // do not allow a.href to reload the page. The confirm modal dialog will do it async if needed.
+  };
+
+  /**
+   * Update the content of a modal asking a confirmation for PrestaTrust and open it
+   *
+   * @param {array} result containing module data
+   * @return {void}
+   */
+  _confirmPrestaTrust(result) {
+    var that = this;
+    var modal = this._replacePrestaTrustPlaceholders(result);
+
+    modal.find(".pstrust-install").off('click').on('click', function() {
+      // Find related form, update it and submit it
+      var install_button = $(that.moduleActionMenuInstallLinkSelector, '.module-item[data-tech-name="' + result.module.attributes.name + '"]');
+      var form = install_button.parent("form");
+      $('<input>').attr({
+        type: 'hidden',
+        value: '1',
+        name: 'actionParams[confirmPrestaTrust]'
+      }).appendTo(form);
+
+      install_button.click();
+      modal.modal('hide');
+    });
+
+    modal.modal();
+  };
+
+  _replacePrestaTrustPlaceholders(result) {
+    var modal = $("#modal-prestatrust");
+    var module = result.module.attributes;
+
+    if (result.confirmation_subject !== 'PrestaTrust' || !modal.length) {
+      return;
+    }
+
+    var alertClass = module.prestatrust.status ? 'success' : 'warning';
+
+    if (module.prestatrust.check_list.property) {
+      modal.find("#pstrust-btn-property-ok").show();
+      modal.find("#pstrust-btn-property-nok").hide();
+    } else {
+      modal.find("#pstrust-btn-property-ok").hide();
+      modal.find("#pstrust-btn-property-nok").show();
+      modal.find("#pstrust-buy").attr("href", module.url).toggle(module.url !== null);
+    }
+
+    modal.find("#pstrust-img").attr({src: module.img, alt: module.name});
+    modal.find("#pstrust-name").text(module.displayName);
+    modal.find("#pstrust-author").text(module.author);
+    modal.find("#pstrust-label").attr("class", "text-" + alertClass).text(module.prestatrust.status ? 'OK' : 'KO');
+    modal.find("#pstrust-message").attr("class", "alert alert-"+alertClass);
+    modal.find("#pstrust-message > p").text(module.prestatrust.message);
+
+    return modal;
+  }
+
+  _dispatchPreEvent(action, element) {
+    var event = jQuery.Event('module_card_action_event');
+
+    $(element).trigger(event, [action]);
+    if (event.isPropagationStopped() !== false || event.isImmediatePropagationStopped() !== false) {
+      return false; // if all handlers have not been called, then stop propagation of the click event.
+    }
+
+    return (event.result !== false); // explicit false must be set from handlers to stop propagation of the click event.
+  };
+
+  _requestToController(action, element, forceDeletion) {
+    var self = this;
+    var jqElementObj = element.closest(this.moduleItemActionsSelector);
+    var form = element.closest("form");
+    var spinnerObj = $("<button class=\"btn-primary-reverse onclick unbind spinner \"></button>");
+    var url = "//" + window.location.host + form.attr("action");
+    var actionParams = form.serializeArray();
+
+    if (forceDeletion === "true" || forceDeletion === true) {
+      actionParams.push({name: "actionParams[deletion]", value: true});
+    }
+
+    $.ajax({
+      url: url,
+      dataType: 'json',
+      method: 'POST',
+      data: actionParams,
+      beforeSend: function () {
+        jqElementObj.hide();
+        jqElementObj.after(spinnerObj);
+      }
+    }).done(function (result) {
+      if (typeof result === undefined) {
+        $.growl.error({message: "No answer received from server"});
+      } else {
+        var moduleTechName = Object.keys(result)[0];
+
+        if (result[moduleTechName].status === false) {
+          if (typeof result[moduleTechName].confirmation_subject !== 'undefined') {
+            self._confirmPrestaTrust(result[moduleTechName]);
+          }
+
+          $.growl.error({message: result[moduleTechName].msg});
+        } else {
+          $.growl.notice({message: result[moduleTechName].msg});
+
+          var alteredSelector = null;
+          var mainElement = null;
+
+          if (action == "uninstall") {
+            jqElementObj.fadeOut(function() {
+              alteredSelector = self._getModuleItemSelector().replace('.', '');
+              mainElement = jqElementObj.parents('.' + alteredSelector).first();
+              mainElement.remove();
+            });
+
+            BOEvent.emitEvent("Module Uninstalled", "CustomEvent");
+          } else if (action == "disable") {
+
+            alteredSelector = self._getModuleItemSelector().replace('.', '');
+            mainElement = jqElementObj.parents('.' + alteredSelector).first();
+            mainElement.addClass(alteredSelector + '-isNotActive');
+            mainElement.attr('data-active', '0');
+
+            BOEvent.emitEvent("Module Disabled", "CustomEvent");
+          } else if (action == "enable") {
+            alteredSelector = self._getModuleItemSelector().replace('.', '');
+
+            mainElement = jqElementObj.parents('.' + alteredSelector).first();
+            mainElement.removeClass(alteredSelector + '-isNotActive');
+            mainElement.attr('data-active', '1');
+
+            BOEvent.emitEvent("Module Enabled", "CustomEvent");
+          }
+
+          jqElementObj.replaceWith(result[moduleTechName].action_menu_html);
+        }
+      }
+    }).always(function () {
+      jqElementObj.fadeIn();
+      spinnerObj.remove();
+    });
+
+    return false;
+  };
+}

iadmin/themes/new-theme/js/components/multiple-choice-table.js

@@ -0,0 +1,57 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+const $ = window.$;
+
+/**
+ * MultipleChoiceTable is responsible for managing common actions in multiple choice table form type
+ */
+export default class MultipleChoiceTable {
+  /**
+   * Init constructor
+   */
+  constructor() {
+    $(document).on('click', '.js-multiple-choice-table-select-column', (e) => this.handleSelectColumn(e));
+  }
+
+  /**
+   * Check/uncheck all boxes in column
+   *
+   * @param {Event} event
+   */
+  handleSelectColumn(event) {
+    event.preventDefault();
+
+    const $selectColumnBtn = $(event.target);
+    const checked = $selectColumnBtn.data('column-checked');
+    $selectColumnBtn.data('column-checked', !checked);
+
+    const $table = $selectColumnBtn.closest('table');
+
+    $table
+      .find('tbody tr td:nth-child(' + $selectColumnBtn.data('column-num') + ') input[type=checkbox]')
+      .prop('checked', !checked);
+  }
+}

iadmin/themes/new-theme/js/components/showcase-card/extension/showcase-card-close-extension.js

@@ -0,0 +1,41 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+/**
+ * Class ShowcaseCardCloseExtension is responsible for providing helper block closing behavior
+ */
+export default class ShowcaseCardCloseExtension {
+
+  /**
+   * Extend helper block.
+   *
+   * @param {ShowcaseCard} helperBlock
+   */
+  extend(helperBlock) {
+    helperBlock.getContainer().on('click', '.js-remove-helper-block', () => {
+      helperBlock.getContainer().remove();
+    });
+  }
+}

iadmin/themes/new-theme/js/components/showcase-card/showcase-card.js

@@ -0,0 +1,60 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+const $ = window.$;
+
+/**
+ * Class ShowcaseCard is responsible for handling events related with showcase card.
+ */
+export default class ShowcaseCard {
+
+  /**
+   * Showcase card id.
+   *
+   * @param {string} id
+   */
+  constructor(id) {
+    this.id = id;
+    this.$container = $('#' + this.id);
+  }
+
+  /**
+   * Get showcase card container.
+   *
+   * @returns {jQuery}
+   */
+  getContainer() {
+    return this.$container;
+  }
+
+  /**
+   * Extend showcase card with external extensions.
+   *
+   * @param {object} extension
+   */
+  addExtension(extension) {
+    extension.extend(this);
+  }
+}

iadmin/themes/new-theme/js/components/translatable-input.js

@@ -0,0 +1,55 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+const $ = window.$;
+
+class TranslatableInput {
+    constructor(options) {
+        options = options || {};
+
+        this.localeItemSelector = options.localeItemSelector || '.js-locale-item';
+        this.localeButtonSelector = options.localeButtonSelector || '.js-locale-btn';
+        this.localeInputSelector = options.localeInputSelector || 'input.js-locale-input';
+
+        $('body').on('click', this.localeItemSelector, this.toggleInputs.bind(this));
+    }
+
+    /**
+     * Toggle all translatable inputs in form in which locale was changed
+     *
+     * @param {Event} event
+     */
+    toggleInputs(event) {
+        const localeItem = $(event.target);
+        const form = localeItem.closest('form');
+        const selectedLocale = localeItem.data('locale');
+
+        form.find(this.localeButtonSelector).text(selectedLocale);
+        form.find(this.localeInputSelector).addClass('d-none');
+        form.find(this.localeInputSelector+'.js-locale-' + selectedLocale).removeClass('d-none');
+    }
+}
+
+export default TranslatableInput;

iadmin/themes/new-theme/js/header.js

@@ -0,0 +1,173 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+import refreshNotifications from './notifications.js';
+
+const $ = window.$;
+
+export default class Header {
+  constructor() {
+    $(() => {
+      this.initQuickAccess();
+      this.initMultiStores();
+      this.initNotificationsToggle();
+      this.initSearch();
+      this.initContentDivOffset();
+      refreshNotifications();
+    });
+  }
+
+  initQuickAccess() {
+    $('.js-quick-link').on('click', (e) => {
+      e.preventDefault();
+
+      let method = $(e.target).data('method');
+      let name = null;
+
+      if (method === 'add') {
+        let text = $(e.target).data('prompt-text');
+        let link = $(e.target).data('link');
+
+        name = prompt(text, link);
+      }
+      if (method === 'add' && name || method === 'remove') {
+        let postLink = $(e.target).data('post-link');
+        let quickLinkId = $(e.target).data('quicklink-id');
+        let rand = $(e.target).data('rand');
+        let url = $(e.target).data('url');
+        let icon = $(e.target).data('icon');
+
+        $.ajax({
+          type: 'POST',
+          headers: {
+            "cache-control": "no-cache"
+          },
+          async: true,
+          url: `${postLink}&action=GetUrl&rand=${rand}&ajax=1&method=${method}&id_quick_access=${quickLinkId}`,
+          data: {
+            "url": url,
+            "name": name,
+            "icon": icon
+          },
+          dataType: "json",
+          success: (data) => {
+            var quicklink_list = '';
+            $.each(data, (index) => {
+              if (typeof data[index]['name'] !== 'undefined')
+                quicklink_list += '<li><a href="' + data[index]['link'] + '&token=' + data[index]['token'] + '"><i class="icon-chevron-right"></i> ' + data[index]['name'] + '</a></li>';
+            });
+
+            if (typeof data['has_errors'] !== 'undefined' && data['has_errors'])
+              $.each(data, (index) => {
+                if (typeof data[index] === 'string')
+                  $.growl.error({
+                    title: '',
+                    message: data[index]
+                  });
+              });
+            else if (quicklink_list) {
+              $("#header_quick ul.dropdown-menu").html(quicklink_list);
+              window.showSuccessMessage(window.update_success_msg);
+            }
+          }
+        });
+      }
+    });
+  }
+
+  initMultiStores() {
+    $('.js-link').on('click', (e) => {
+      window.open($(e.target).parents('.link').attr('href'), '_blank');
+    });
+  }
+
+  initNotificationsToggle() {
+    $('.notification.dropdown-toggle').on('click', () => {
+      if(!$('.mobile-nav').hasClass('expanded')) {
+        this.updateEmployeeNotifications();
+      }
+    });
+
+    $('body').on('click', function (e) {
+      if (!$('div.notification-center.dropdown').is(e.target)
+        && $('div.notification-center.dropdown').has(e.target).length === 0
+        && $('.open').has(e.target).length === 0
+      ) {
+
+        if ($('div.notification-center.dropdown').hasClass('open')) {
+          $('.mobile-layer').removeClass('expanded');
+          refreshNotifications();
+        }
+      }
+    });
+
+    $('.notification-center .nav-link').on('shown.bs.tab', () => {
+      this.updateEmployeeNotifications();
+    });
+  }
+
+  initSearch() {
+    $('.js-items-list').on('click', (e) => {
+      $('.js-form-search').attr('placeholder', $(e.target).data('placeholder'));
+      $('.js-search-type').val($(e.target).data('value'));
+      $('.js-dropdown-toggle').text($(e.target).data('item'));
+    });
+  }
+
+  updateEmployeeNotifications() {
+    $.post(
+      baseAdminDir + "ajax.php",
+      {
+        "updateElementEmployee": "1",
+        "updateElementEmployeeType": $('.notification-center .nav-link.active').attr('data-type')
+      }
+    );
+  }
+
+  /**
+   * Updates the offset of the content div in whenever the header changes size
+   */
+  initContentDivOffset() {
+
+    const onToolbarResize = function() {
+      const toolbar = $('.header-toolbar').last();
+      const header = $('.main-header');
+      const content = $('.content-div');
+      const spacing = 15;
+
+      if (toolbar.length && header.length && content.length) {
+        content.css('padding-top', toolbar.outerHeight() + header.outerHeight() + spacing);
+      }
+    };
+
+    // update the offset now
+    onToolbarResize();
+
+    // update when resizing the window
+    $(window).resize(onToolbarResize);
+
+    // update when replacing the header with a vue header
+    $(document).on('vueHeaderMounted', onToolbarResize);
+  }
+}

iadmin/themes/new-theme/js/maintenance-page/index.js

@@ -0,0 +1,37 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+import IpInput from './ip-input';
+
+const $ = window.$;
+
+$(() => {
+  // Do not run if we're not on the maintenance page
+  if (!window.location.pathname.match('/configure/shop/maintenance\\b')) {
+      return;
+  }
+
+  IpInput.init();
+});

iadmin/themes/new-theme/js/maintenance-page/ip-input.js

@@ -0,0 +1,45 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+const $ = window.$;
+const IpInput = {};
+
+IpInput.addRemoteAddr = (event) => {
+  const input = $(event.target).prev('input');
+  const inputValue = input.val() || "";
+  const ip = event.target.dataset.ip || "";
+  if (inputValue.length > 0) {
+    if (input.val().indexOf(ip) < 0) {
+      input.val(input.val() + ',' + ip);
+    }
+  } else {
+    input.val(ip);
+  }
+};
+
+IpInput.init = () => {
+    $("body").on("click", '.add_ip_button', IpInput.addRemoteAddr);
+};
+
+export default IpInput;

iadmin/themes/new-theme/js/nav_bar.js

@@ -0,0 +1,196 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+const $ = window.$;
+
+export default class NavBar {
+  constructor() {
+    $(() => {
+      $(".nav-bar").find(".link-levelone").hover(function() {
+        $(this).addClass("-hover");
+      }, function() {
+        $(this).removeClass("-hover");
+      });
+
+      $('.nav-bar li.link-levelone.has_submenu > a').on('click', function(e) {
+          e.preventDefault();
+          e.stopPropagation();
+          let $submenu = $(this).parent();
+          $('.nav-bar li.link-levelone.has_submenu a > i.material-icons.sub-tabs-arrow')
+              .text('keyboard_arrow_down');
+          let onlyClose = $(e.currentTarget).parent().hasClass('ul-open');
+
+          if ($('body').is('.page-sidebar-closed:not(.mobile)')) {
+              $('.nav-bar li.link-levelone.has_submenu.ul-open').removeClass('ul-open open -hover');
+              $('.nav-bar li.link-levelone.has_submenu.ul-open ul.submenu').removeAttr('style');
+          } else {
+              $('.nav-bar li.link-levelone.has_submenu.ul-open ul.submenu').slideUp({
+                  complete: function() {
+                      $(this).parent().removeClass('ul-open open');
+                      $(this).removeAttr('style');
+                  }
+              });
+          }
+
+          if (onlyClose) {
+              return;
+          }
+          $submenu.addClass('ul-open');
+
+          if ($('body').is('.page-sidebar-closed:not(.mobile)')) {
+              $submenu.addClass('-hover');
+              $submenu.find('ul.submenu').removeAttr('style');
+          } else {
+              $submenu.find('ul.submenu').slideDown({
+                  complete: function() {
+                      $submenu.addClass('open');
+                      $(this).removeAttr('style');
+                  }
+              });
+          }
+          $submenu.find('i.material-icons.sub-tabs-arrow').text('keyboard_arrow_up');
+      });
+
+      $('.nav-bar').on('click', '.menu-collapse', function() {
+        $('body').toggleClass('page-sidebar-closed');
+
+        $('.popover.show').remove();
+        $('.help-box[aria-describedby]').removeAttr('aria-describedby');
+
+        if ($('body').hasClass('page-sidebar-closed')) {
+          $('nav.nav-bar ul.main-menu > li')
+              .removeClass('ul-open open')
+              .find('a > i.material-icons.sub-tabs-arrow').text('keyboard_arrow_down');
+          addMobileBodyClickListener();
+        } else {
+            $('nav.nav-bar ul.main-menu > li.-active')
+                .addClass('ul-open open')
+                .find('a > i.material-icons.sub-tabs-arrow').text('keyboard_arrow_up');
+          $('body').off('click.mobile');
+        }
+
+        $.ajax({
+          url: "index.php",
+          cache: false,
+          data: {
+            token: window.employee_token,
+            ajax: 1,
+            action: 'toggleMenu',
+            tab: 'AdminEmployees',
+            collapse: Number($('body').hasClass('page-sidebar-closed'))
+          },
+        });
+      });
+      addMobileBodyClickListener();
+      const MAX_MOBILE_WIDTH = 1023;
+
+      if ($(window).width() <= MAX_MOBILE_WIDTH) {
+          this.mobileNav(MAX_MOBILE_WIDTH);
+      }
+
+      $(window).on('resize', () => {
+          if ($('body').hasClass('mobile') && $(window).width() > MAX_MOBILE_WIDTH) {
+              this.unbuildMobileMenu();
+          } else if (!$('body').hasClass('mobile') && $(window).width() <= MAX_MOBILE_WIDTH) {
+              this.mobileNav(MAX_MOBILE_WIDTH);
+          }
+      });
+
+      function addMobileBodyClickListener() {
+          if (!$('body').is('.page-sidebar-closed:not(.mobile)')) {
+              return;
+          }
+          // To close submenu on mobile devices
+          $('body').on('click.mobile', function() {
+              if ($('ul.main-menu li.ul-open').length > 0) {
+                  $('.nav-bar li.link-levelone.has_submenu.ul-open').removeClass('ul-open open -hover');
+                  $('.nav-bar li.link-levelone.has_submenu.ul-open ul.submenu').removeAttr('style');
+              }
+          });
+      }
+    });
+  }
+
+  mobileNav() {
+    let $logout = $('#header_logout').addClass('link').removeClass('m-t-1').prop('outerHTML');
+    let $employee = $('.employee_avatar').prop('outerHTML');
+    let profileLink = $('.profile-link').attr('href');
+    const $mainMenu = $('.main-menu');
+
+    $('.nav-bar li.link-levelone.has_submenu:not(.open) a > i.material-icons.sub-tabs-arrow').text('keyboard_arrow_down');
+    $('body').addClass('mobile');
+    $('.nav-bar').addClass('mobile-nav').attr('style', 'margin-left: -100%;');
+    $('.panel-collapse').addClass('collapse');
+    $('.link-levelone a').each((index, el) => {
+      let id = $(el).parent().find('.collapse').attr('id');
+      if (id) {
+        $(el).attr('href', `#${id}`).attr('data-toggle', 'collapse');
+      }
+    });
+    $mainMenu.append(`<li class="link-levelone" data-submenu="">${$logout}</li>`);
+    $mainMenu.prepend(`<li class="link-levelone">${$employee}</li>`);
+    $('.collapse').collapse({
+      toggle: false
+    });
+    $mainMenu.find('.employee_avatar .material-icons, .employee_avatar span').wrap(`<a href="${profileLink}"></a>`);
+    $('.js-mobile-menu').on('click', expand);
+    $('.js-notifs_dropdown').css({
+      'height': window.innerHeight
+    });
+
+    function expand(e) {
+        if ($('div.notification-center.dropdown').hasClass('open')) {
+            return;
+        }
+
+        if ($('.mobile-nav').hasClass('expanded')) {
+            $('.mobile-nav').animate({'margin-left': '-100%'}, {
+                complete: function() {
+                    $('.nav-bar, .mobile-layer').removeClass('expanded');
+                    $('.nav-bar, .mobile-layer').addClass('d-none');
+                }
+            });
+            $('.mobile-layer').off();
+        } else {
+            $('.nav-bar, .mobile-layer').addClass('expanded');
+            $('.nav-bar, .mobile-layer').removeClass('d-none');
+            $('.mobile-layer').on('click', expand);
+            $('.mobile-nav').animate({'margin-left': 0});
+        }
+    }
+  }
+
+  unbuildMobileMenu() {
+    $('body').removeClass('mobile');
+    $('body.page-sidebar-closed .nav-bar .link-levelone.open').removeClass('ul-open open');
+    $('.main-menu li:first, .main-menu li:last').remove();
+    $('.js-notifs_dropdown').removeAttr('style');
+    $('.nav-bar').removeClass('mobile-nav expanded').addClass('d-none').css('margin-left', 0);
+    $('.js-mobile-menu').off();
+    $('.panel-collapse').removeClass('collapse').addClass('submenu');
+    $('.shop-list-title').remove();
+    $('.js-non-responsive').hide();
+    $('.mobile-layer').addClass('d-none').removeClass('expanded');
+  }
+}

iadmin/themes/new-theme/js/notifications.js

@@ -0,0 +1,101 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+const refreshNotifications = function () {
+  let timer = null;
+
+  $.ajax({
+    type: 'POST',
+    headers: {"cache-control": "no-cache"},
+    url: `${baseAdminDir}ajax.php?rand=${new Date().getTime()}`,
+    async: true,
+    cache: false,
+    dataType: 'json',
+    data: {"getNotifications": "1"},
+    success: function (json) {
+      if (json) {
+        let nbOrders = parseInt(json.order.total);
+        let nbCustomers = parseInt(json.customer.total);
+        let nbCustomerMessages = parseInt(json.customer_message.total);
+        let notifications_total = nbOrders + nbCustomers + nbCustomerMessages;
+
+        fillTpl(json.order.results, $("#orders-notifications"), $("#order-notification-template").html());
+        fillTpl(json.customer.results, $("#customers-notifications"), $("#customer-notification-template").html());
+        fillTpl(json.customer_message.results, $("#messages-notifications"), $("#message-notification-template").html());
+
+        setNotificationsNumber("_nb_new_orders_", nbOrders);
+        setNotificationsNumber("_nb_new_customers_", nbCustomers);
+        setNotificationsNumber("_nb_new_messages_", nbCustomerMessages);
+        if(notifications_total) {
+          $('#notifications-total').removeClass('hide').html(notifications_total);
+        }
+        else {
+          $('#notifications-total').remove();
+        }
+      }
+      timer = setTimeout(refreshNotifications, 120000);
+    }
+  });
+
+  clearTimeout(timer);
+}
+
+let fillTpl = function (results, eltAppendTo, tpl) {
+  eltAppendTo.children('.notification-elements').empty();
+  if (results.length > 0) {
+    eltAppendTo.removeClass('empty');
+    $.each(results, function (property, value) {
+      if (undefined === tpl) {
+        return;
+      }
+
+      eltAppendTo.children('.notification-elements').append(
+        tpl.replace(/_id_order_/g, parseInt(value.id_order))
+          .replace(/_customer_name_/g, value.customer_name)
+          .replace(/_iso_code_/g, value.iso_code)
+          .replace(/_carrier_/g, (value.carrier !== "" ? ` - ${value.carrier}` : ""))
+          .replace(/_total_paid_/g, value.total_paid)
+          .replace(/_id_customer_/g, parseInt(value.id_customer))
+          .replace(/_company_/g, (value.company !== "" ? ` (${value.company}) ` : ""))
+          .replace(/_date_add_/g, value.date_add)
+          .replace(/_status_/g, value.status)
+          .replace(/order_url/g, `${baseAdminDir}index.php?tab=AdminOrders&token=${token_admin_orders}&vieworder&id_order=${value.id_order}`)
+          .replace(/customer_url/g, `${baseAdminDir}index.php?tab=AdminCustomers&token=${token_admin_customers}&viewcustomer&id_customer=${value.id_customer}`)
+          .replace(/message_url/g, `${baseAdminDir}index.php?tab=AdminCustomerThreads&token=${token_admin_customer_threads}&viewcustomer_thread&id_customer_thread=${value.id_customer_thread}`)
+      );
+    });
+  } else {
+    eltAppendTo.addClass('empty');
+  }
+}
+
+let setNotificationsNumber = function (id, number) {
+  if (number > 0) {
+    $(`#${id}`).text(` (${number})`);
+  } else {
+    $(`#${id}`).text("");
+  }
+}
+
+export default refreshNotifications

iadmin/themes/new-theme/js/pages/backup/index.js

@@ -0,0 +1,41 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+import Grid from '../../components/grid/grid';
+import BulkActionCheckboxExtension from '../../components/grid/extension/bulk-action-checkbox-extension';
+import SubmitBulkExtension from '../../components/grid/extension/submit-bulk-action-extension';
+import LinkRowActionExtension from '../../components/grid/extension/link-row-action-extension';
+import SubmitRowActionExtension from '../../components/grid/extension/action/row/submit-row-action-extension';
+
+const $ = window.$;
+
+$(() => {
+  const backupGrid = new Grid('backup');
+
+  backupGrid.addExtension(new BulkActionCheckboxExtension());
+  backupGrid.addExtension(new SubmitBulkExtension());
+  backupGrid.addExtension(new LinkRowActionExtension());
+  backupGrid.addExtension(new SubmitRowActionExtension());
+});

iadmin/themes/new-theme/js/pages/catalog/product/index.js

@@ -0,0 +1,32 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+import SpecificPriceFormHandler from './specific-price-form-handler';
+
+const $ = window.$;
+
+$(() => {
+  new SpecificPriceFormHandler();
+});

iadmin/themes/new-theme/js/pages/catalog/product/specific-price-form-handler.js

@@ -0,0 +1,497 @@
+/**
+ * 2007-2018 PrestaShop
+ *
+ * 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.txt.
+ * 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 http://www.prestashop.com for more information.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright 2007-2018 PrestaShop SA
+ * @license   https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
+ * International Registered Trademark & Property of PrestaShop SA
+ */
+
+const $ = window.$;
+
+class SpecificPriceFormHandler {
+
+  constructor() {
+    this.prefixCreateForm = 'form_step2_specific_price_';
+    this.prefixEditForm = 'form_modal_';
+    this.editModalIsOpen = false;
+
+    this.$createPriceFormDefaultValues = new Object();
+    this.storePriceFormDefaultValues();
+
+    this.loadAndDisplayExistingSpecificPricesList();
+
+    this.configureAddPriceFormBehavior();
+
+    this.configureEditPriceModalBehavior();
+
+    this.configureDeletePriceButtonsBehavior();
+
+    this.configureMultipleModalsBehavior();
+  }
+
+  /**
+   * @private
+   */
+  loadAndDisplayExistingSpecificPricesList() {
+    var listContainer = $('#js-specific-price-list');
+    var url = listContainer.data('listingUrl').replace(/list\/\d+/, 'list/' + this.getProductId());
+
+    $.ajax({
+      type: 'GET',
+      url: url,
+    })
+        .done(specificPrices => {
+          var tbody = listContainer.find('tbody');
+          tbody.find('tr').remove();
+
+          if (specificPrices.length > 0) {
+            listContainer.removeClass('hide');
+          } else {
+            listContainer.addClass('hide');
+          }
+
+          var specificPricesList = this.renderSpecificPricesListingAsHtml(specificPrices);
+
+          tbody.append(specificPricesList);
+        });
+  }
+
+  /**
+   * @param array specificPrices
+   *
+   * @returns string
+   *
+   * @private
+   */
+  renderSpecificPricesListingAsHtml(specificPrices) {
+    var specificPricesList = '';
+
+    var self = this;
+
+    $.each(specificPrices, (index, specificPrice) => {
+      var deleteUrl = $('#js-specific-price-list').attr('data-action-delete').replace(/delete\/\d+/, 'delete/' + specificPrice.id_specific_price);
+      var row = self.renderSpecificPriceRow(specificPrice, deleteUrl);
+
+      specificPricesList = specificPricesList + row;
+    });
+
+    return specificPricesList;
+  }
+
+  /**
+   * @param Object specificPrice
+   * @param string deleteUrl
+   *
+   * @returns string
+   *
+   * @private
+   */
+  renderSpecificPriceRow(specificPrice, deleteUrl) {
+
+    var specificPriceId = specificPrice.id_specific_price;
+
+    var row = '<tr>' +
+        '<td>' + specificPrice.rule_name + '</td>' +
+        '<td>' + specificPrice.attributes_name + '</td>' +
+        '<td>' + specificPrice.currency + '</td>' +
+        '<td>' + specificPrice.country + '</td>' +
+        '<td>' + specificPrice.group + '</td>' +
+        '<td>' + specificPrice.customer + '</td>' +
+        '<td>' + specificPrice.fixed_price + '</td>' +
+        '<td>' + specificPrice.impact + '</td>' +
+        '<td>' + specificPrice.period + '</td>' +
+        '<td>' + specificPrice.from_quantity + '</td>' +
+        '<td>' + (specificPrice.can_delete ? '<a href="' + deleteUrl + '" class="js-delete delete btn tooltip-link delete pl-0 pr-0"><i class="material-icons">delete</i></a>' : '') + '</td>' +
+        '<td>' + (specificPrice.can_edit ? '<a href="#" data-specific-price-id="' + specificPriceId + '" class="js-edit edit btn tooltip-link delete pl-0 pr-0"><i class="material-icons">edit</i></a>' : '') + '</td>' +
+        '</tr>';
+
+    return row;
+  }
+
+  /**
+   * @private
+   */
+  configureAddPriceFormBehavior() {
+    const usePrefixForCreate = true;
+    var selectorPrefix = this.getPrefixSelector(usePrefixForCreate);
+
+    $('#specific_price_form .js-cancel').click(() => {
+      this.resetCreatePriceFormDefaultValues();
+      $('#specific_price_form').collapse('hide');
+    });
+
+    $('#specific_price_form .js-save').on('click', () => this.submitCreatePriceForm());
+
+    $('#js-open-create-specific-price-form').on('click', () => this.loadAndFillOptionsForSelectCombinationInput(usePrefixForCreate));
+
+    $(selectorPrefix + 'leave_bprice').on('click', () => this.enableSpecificPriceFieldIfEligible(usePrefixForCreate));
+
+    $(selectorPrefix + 'sp_reduction_type').on('change', () => this.enableSpecificPriceTaxFieldIfEligible(usePrefixForCreate));
+  }
+
+  /**
+   * @private
+   */
+  configureEditPriceFormInsideModalBehavior() {
+    const usePrefixForCreate = false;
+    var selectorPrefix = this.getPrefixSelector(usePrefixForCreate);
+
+    $('#form_modal_cancel').click(() => this.closeEditPriceModalAndRemoveForm());
+    $('#form_modal_close').click(() => this.closeEditPriceModalAndRemoveForm());
+
+    $('#form_modal_save').click(() => this.submitEditPriceForm());
+
+    this.loadAndFillOptionsForSelectCombinationInput(usePrefixForCreate);
+
+    $(selectorPrefix + 'leave_bprice').on('click', () => this.enableSpecificPriceFieldIfEligible(usePrefixForCreate));
+
+    $(selectorPrefix + 'sp_reduction_type').on('change', () => this.enableSpecificPriceTaxFieldIfEligible(usePrefixForCreate));
+
+    this.reinitializeDatePickers();
+
+    this.initializeLeaveBPriceField(usePrefixForCreate);
+    this.enableSpecificPriceTaxFieldIfEligible(usePrefixForCreate);
+  }
+
+  /**
+   * @private
+   */
+  reinitializeDatePickers() {
+    $('.datepicker input').datetimepicker({format: 'YYYY-MM-DD'});
+  }
+
+  /**
+   * @param boolean usePrefixForCreate
+   *
+   * @private
+   */
+  initializeLeaveBPriceField(usePrefixForCreate) {
+    var selectorPrefix = this.getPrefixSelector(usePrefixForCreate);
+
+    if ($(selectorPrefix + 'sp_price').val() != '') {
+      $(selectorPrefix + 'sp_price').prop('disabled', false);
+      $(selectorPrefix + 'leave_bprice').prop('checked', false);
+    }
+  }
+
+  /**
+   * @private
+   */
+  configureEditPriceModalBehavior() {
+    $(document).on('click', '#js-specific-price-list .js-edit', (event) => {
+      event.preventDefault();
+
+      var specificPriceId = $(event.currentTarget).data('specificPriceId');
+
+      this.openEditPriceModalAndLoadForm(specificPriceId);
+    });
+
+  }
+
+  /**
+   * @private
+   */
+  configureDeletePriceButtonsBehavior() {
+    $(document).on('click', '#js-specific-price-list .js-delete', (event) => {
+      event.preventDefault();
+      this.deleteSpecificPrice(event.currentTarget);
+    });
+  }
+
+  /**
+   * @see https://vijayasankarn.wordpress.com/2017/02/24/quick-fix-scrolling-and-focus-when-multiple-bootstrap-modals-are-open/
+   */
+  configureMultipleModalsBehavior() {
+    $('.modal').on('hidden.bs.modal', () => {
+      if (this.editModalIsOpen) {
+        $('body').addClass('modal-open');
+      }
+    });
+  }
+
+  /**
+   * @private
+   */
+  submitCreatePriceForm() {
+
+    const url = $('#specific_price_form').attr('data-action');
+    const data = $('#specific_price_form input, #specific_price_form select, #form_id_product').serialize();
+
+    $('#specific_price_form .js-save').attr('disabled', 'disabled');
+
+    $.ajax({
+      type: 'POST',
+      url: url,
+      data: data,
+    })
+        .done(response => {
+          showSuccessMessage(translate_javascripts['Form update success']);
+          this.resetCreatePriceFormDefaultValues();
+          $('#specific_price_form').collapse('hide');
+          this.loadAndDisplayExistingSpecificPricesList();
+
+          $('#specific_price_form .js-save').removeAttr('disabled');
+
+        })
+        .fail(errors => {
+          showErrorMessage(errors.responseJSON);
+
+          $('#specific_price_form .js-save').removeAttr('disabled');
+        });
+  }
+
+  /**
+   * @private
+   */
+  submitEditPriceForm() {
+    const baseUrl = $('#edit-specific-price-modal-form').attr('data-action');
+    const specificPriceId = $('#edit-specific-price-modal-form').data('specificPriceId');
+    const url = baseUrl.replace(/update\/\d+/, 'update/' + specificPriceId);
+
+    const data = $('#edit-specific-price-modal-form input, #edit-specific-price-modal-form select, #form_id_product').serialize();
+
+    $('#edit-specific-price-modal-form .js-save').attr('disabled', 'disabled');
+
+    $.ajax({
+      type: 'POST',
+      url: url,
+      data: data,
+    })
+        .done(response => {
+          showSuccessMessage(translate_javascripts['Form update success']);
+          this.closeEditPriceModalAndRemoveForm();
+          this.loadAndDisplayExistingSpecificPricesList();
+          $('#edit-specific-price-modal-form .js-save').removeAttr('disabled');
+        })
+        .fail(errors => {
+          showErrorMessage(errors.responseJSON);
+
+          $('#edit-specific-price-modal-form .js-save').removeAttr('disabled');
+        });
+  }
+
+  /**
+   * @param string clickedLink selector
+   *
+   * @private
+   */
+  deleteSpecificPrice(clickedLink) {
+    modalConfirmation.create(translate_javascripts['This will delete the specific price. Do you wish to proceed?'], null, {
+      onContinue: () => {
+
+        var url = $(clickedLink).attr('href');
+        $(clickedLink).attr('disabled', 'disabled');
+
+        $.ajax({
+          type: 'GET',
+          url: url,
+        })
+            .done(response => {
+              this.loadAndDisplayExistingSpecificPricesList();
+              showSuccessMessage(response);
+              $(clickedLink).removeAttr('disabled');
+            })
+            .fail(errors => {
+              showErrorMessage(errors.responseJSON);
+              $(clickedLink).removeAttr('disabled');
+
+            });
+      }
+    }).show();
+  }
+
+  /**
+   * Store 'add specific price' form values
+   * for future usage
+   *
+   * @private
+   */
+  storePriceFormDefaultValues() {
+    var storage = this.$createPriceFormDefaultValues;
+
+    $('#specific_price_form').find('select,input').each((index, value) => {
+      storage[$(value).attr('id')] = $(value).val();
+    });
+
+    $('#specific_price_form').find('input:checkbox').each((index, value) => {
+      storage[$(value).attr('id')] = $(value).prop('checked');
+    });
+
+    this.$createPriceFormDefaultValues = storage;
+  }
+
+  /**
+   * @param boolean usePrefixForCreate
+   *
+   * @private
+   */
+  loadAndFillOptionsForSelectCombinationInput(usePrefixForCreate) {
+
+    var selectorPrefix = this.getPrefixSelector(usePrefixForCreate);
+
+    var inputField = $(selectorPrefix + 'sp_id_product_attribute');
+    var url = inputField.attr('data-action').replace(/product-combinations\/\d+/, 'product-combinations/' + this.getProductId());
+
+    $.ajax({
+      type: 'GET',
+      url: url,
+    })
+        .done(combinations => {
+          /** remove all options except first one */
+          inputField.find('option:gt(0)').remove();
+
+          $.each(combinations, (index, combination) => {
+            inputField.append('<option value="' + combination.id + '">' + combination.name + '</option>');
+          });
+
+          if (inputField.data('selectedAttribute') != '0') {
+            inputField.val(inputField.data('selectedAttribute')).trigger('change');
+          }
+        });
+  }
+
+  /**
+   * @param boolean usePrefixForCreate
+   *
+   * @private
+   */
+  enableSpecificPriceTaxFieldIfEligible(usePrefixForCreate) {
+
+    var selectorPrefix = this.getPrefixSelector(usePrefixForCreate);
+
+    if ($(selectorPrefix + 'sp_reduction_type').val() === 'percentage') {
+      $(selectorPrefix + 'sp_reduction_tax').hide();
+    } else {
+      $(selectorPrefix + 'sp_reduction_tax').show();
+    }
+  }
+
+  /**
+   * Reset 'add specific price' form values
+   * using previously stored default values
+   *
+   * @private
+   */
+  resetCreatePriceFormDefaultValues() {
+    var previouslyStoredValues = this.$createPriceFormDefaultValues;
+
+    $('#specific_price_form').find('input').each((index, value) => {
+      $(value).val(previouslyStoredValues[$(value).attr('id')]);
+    });
+
+    $('#specific_price_form').find('select').each((index, value) => {
+      $(value).val(previouslyStoredValues[$(value).attr('id')]).change();
+    });
+
+    $('#specific_price_form').find('input:checkbox').each((index, value) => {
+      $(value).prop("checked", true);
+    });
+  }
+
+  /**
+   * @param boolean usePrefixForCreate
+   *
+   * @private
+   */
+  enableSpecificPriceFieldIfEligible(usePrefixForCreate) {
+    var selectorPrefix = this.getPrefixSelector(usePrefixForCreate);
+
+    $(selectorPrefix + 'sp_price').prop('disabled', $(selectorPrefix + 'leave_bprice').is(':checked')).val('');
+  }
+
+  /**
+   * Open 'edit specific price' form into a modal
+   *
+   * @param integer specificPriceId
+   *
+   * @private
+   */
+  openEditPriceModalAndLoadForm(specificPriceId) {
+    const url = $('#js-specific-price-list').data('actionEdit').replace(/form\/\d+/, 'form/' + specificPriceId);
+
+    $('#edit-specific-price-modal').modal("show");
+    this.editModalIsOpen = true;
+
+    $.ajax({
+      type: 'GET',
+      url: url,
+    })
+        .done(response => {
+          this.insertEditSpecificPriceFormIntoModal(response);
+          $('#edit-specific-price-modal-form').data('specificPriceId', specificPriceId);
+          this.configureEditPriceFormInsideModalBehavior();
+        })
+        .fail(errors => {
+          showErrorMessage(errors.responseJSON);
+        });
+  }
+
+  /**
+   * @private
+   */
+  closeEditPriceModalAndRemoveForm() {
+    $('#edit-specific-price-modal').modal("hide");
+    this.editModalIsOpen = false;
+
+    var formLocationHolder = $('#edit-specific-price-modal-form');
+
+    formLocationHolder.empty();
+  }
+
+  /**
+   * @param string form: HTML 'edit specific price' form
+   *
+   * @private
+   */
+  insertEditSpecificPriceFormIntoModal(form) {
+    var formLocationHolder = $('#edit-specific-price-modal-form');
+
+    formLocationHolder.empty();
+    formLocationHolder.append(form);
+  }
+
+  /**
+   * Get product ID for current Catalog Product page
+   *
+   * @returns integer
+   *
+   * @private
+   */
+  getProductId() {
+    return $('#form_id_product').val();
+  }
+
+  /**
+   * @param boolean usePrefixForCreate
+   *
+   * @returns string
+   *
+   * @private
+   */
+  getPrefixSelector(usePrefixForCreate) {
+    if (usePrefixForCreate == true) {
+      return '#' + this.prefixCreateForm;
+    } else {
+      return '#' + this.prefixEditForm;
+    }
+  }
+}
+
+export default SpecificPriceFormHandler;