<template>
  <div>
    <b-row>
      <b-col>
        <b-row>
          <b-col cols="3">
            <side-filters @change-filters="sideFilter"/>
          </b-col>
          <b-col cols="9">
            <product-list ref="productList" :categories="categories" />
          </b-col>
        </b-row>
      </b-col>
    </b-row>

    
  </div>
</template>

<script>
import SideFilters from '@/components/products/SideFilters.vue';
import ProductList from '@/components/products/product-list/ProductList.vue';

import Paginate from '@/components/shared-components/Paginate' 

export default {
  components: {
    SideFilters,
    ProductList,
    Paginate
  },
  data: () => {
    return {
      totalPages: 10,
   categories: [],
      };
  },
  methods:{
    sideFilter(categories){
      
      this.categories = categories;
    
    }
  }
};
</script>

<style scoped>

</style>
