@meeovi/layer-commerce 1.0.6 → 1.0.8

package/app/components/catalog/vendor/pages/stores.vue

@@ -1,43 +0,0 @@
-<template>
-    <v-card>
-        <v-toolbar color="" title="Stores"></v-toolbar>
-        <v-tabs v-model="tab" bg-color="primary">
-            <v-tab value="one">My Stores</v-tab>
-            <!--<v-tab value="two">Item Two</v-tab>
-            <v-tab value="three">Item Three</v-tab>-->
-        </v-tabs>
-
-        <v-card-text>
-            <v-tabs-window v-model="tab">
-                <v-tabs-window-item value="one">
-                    One
-                </v-tabs-window-item>
-
-                <v-tabs-window-item value="two">
-                    Two
-                </v-tabs-window-item>
-
-                <v-tabs-window-item value="three">
-                    Three
-                </v-tabs-window-item>
-            </v-tabs-window>
-        </v-card-text>
-    </v-card>
-</template>
-
-<script setup>
-    import {
-        ref
-    } from 'vue'
-
-    const tab = ref(null);
-
-    definePageMeta({
-      layout: "sellers",
-      middleware: ['authenticated'],
-    });
-
-    useHead({
-        title: 'Sellers Stores'
-    })
-</script>

package/app/components/categories/chart/[id].vue

@@ -1,200 +0,0 @@
-<template>
-    <div class="contentPage">
-        <v-row>
-            <v-col cols="12">
-                <v-card :color="chartbar?.color">
-                    <div class="d-flex flex-no-wrap justify-space-between">
-                        <div>
-                            <v-card-title class="text-h5">
-                                {{ chart?.name }}
-                            </v-card-title>
-
-                            <v-card-subtitle>{{ chart?.description }}</v-card-subtitle>
-                        </div>
-
-                        <v-avatar class="ma-3" rounded="0" size="125">
-                            <NuxtImg :src="`${$directus.url}/assets/${chart?.image?.filename_disk}`" />
-                        </v-avatar>
-                    </div>
-                </v-card>
-            </v-col>
-
-            <v-col cols="12">
-                <v-card elevation="0">
-                    <v-tabs v-model="tab" :bg-color="chartbar?.color">
-                        <div v-for="(menu, index) in spacebar?.menus" :key="index">
-                            <v-tab :value="menu?.value">{{ menu?.name }}</v-tab>
-                        </div>
-                    </v-tabs>
-
-                    <v-card-text>
-                        <v-tabs-window v-model="tab">
-                            <v-tabs-window-item :value="chartbar?.menus[0]?.value">
-                                <!-- Weekly Chart Table -->
-                                <WeeklyChart :data="topProducts" />
-                            </v-tabs-window-item>
-                            <v-tabs-window-item :value="chartbar?.menus[1]?.value">
-                                <!-- Monthly Chart Table -->
-                                <MonthlyChart :data="topProducts" />
-                            </v-tabs-window-item>
-                            <v-tabs-window-item :value="chartbar?.menus[2]?.value">
-                                <!-- Yearly Chart Table -->
-                                <YearlyChart :data="topProducts" />
-                            </v-tabs-window-item>
-
-                            <v-tabs-window-item :value="chartbar?.menus[3]?.value">
-                                <v-row>
-                                    <v-col v-for="charts in charts" :key="charts">
-                                        <charts :chart="charts" />
-                                    </v-col>
-                                </v-row>
-                            </v-tabs-window-item>
-                        </v-tabs-window>
-                    </v-card-text>
-                </v-card>
-            </v-col>
-        </v-row>
-    </div>
-</template>
-
-<script setup>
-    import {
-        ref,
-        computed
-    } from 'vue'
-    import WeeklyChart from '@/components/charts/weeklyChart.vue'
-    import MonthlyChart from '@/components/charts/monthlyChart.vue'
-    import YearlyChart from '@/components/charts/yearlyChart.vue'
-
-    const tab = ref('weekly')
-    const route = useRoute()
-    const topProducts = ref([]);
-
-    // Add new reactive references
-    const filterOptions = ref({
-        category: null,
-        timeRange: 'weekly'
-    })
-
-    const sortOptions = ref({
-        field: 'sales',
-        order: 'desc'
-    })
-
-    const {
-        $directus,
-        $readItem,
-        $readItems
-    } = useNuxtApp()
-
-    const {
-        data: chart
-    } = await useAsyncData('chart', () => {
-        return $directus.request($readItem('musicchart', route.params.id, {
-            fields: ['*', {
-                '*': ['*']
-            }]
-        }))
-    })
-
-    const {
-        data: charts
-    } = await useAsyncData('charts', () => {
-        return $directus.request($readItems('musicchart', {
-            fields: ['*', {
-                '*': ['*']
-            }]
-        }))
-    })
-
-    const {
-        data: chartbar
-    } = await useAsyncData('chartbar', () => {
-        return $directus.request($readItem('navigation', '53'))
-    })
-
-    const categories = ref([]) // Will be populated from your products data
-
-    // Calculate helper functions
-    const calculateTrend = (current, previous) => {
-        if (current > previous) return 'up';
-        if (current < previous) return 'down';
-        return 'stable';
-    };
-
-    const calculateWeeksOnChart = (firstAppearance) => {
-        const now = new Date();
-        const start = new Date(firstAppearance);
-        return Math.floor((now - start) / (7 * 24 * 60 * 60 * 1000));
-    };
-
-    // Modify your existing fetchChartData function
-    const fetchChartData = async (timeframe) => {
-        try {
-            const now = new Date();
-            let startDate;
-
-            // Determine the start date based on the timeframe
-            if (timeframe === "weekly") {
-                startDate = new Date(now.setDate(now.getDate() - 7));
-            } else if (timeframe === "monthly") {
-                startDate = new Date(now.getFullYear(), now.getMonth(), 1);
-            } else if (timeframe === "yearly") {
-                startDate = new Date(now.getFullYear(), 0, 1);
-            }
-
-            const {
-                data
-            } = await useAsyncData("productChart", () => {
-                return $directus.request(
-                    $readItems("products", {
-                        sort: ["-sales"],
-                        limit: 100,
-                        filter: {
-                            created_on: {
-                                _gte: startDate.toISOString(),
-                            },
-                        },
-                    })
-                );
-            });
-
-            // Process the data and calculate fields
-            const processedData = data.value.map((product) => ({
-                ...product,
-                trend: calculateTrend(product.currentSales, product.previousSales),
-                weeksOnChart: calculateWeeksOnChart(product.firstAppearance),
-            }));
-
-            // Update top products and categories
-            topProducts.value = processedData;
-            categories.value = [...new Set(processedData.map((p) => p.category))];
-        } catch (error) {
-            console.error("Error fetching chart data:", error);
-        }
-    };
-
-    // Watch for tab changes to update data
-    watch(tab, (newValue) => {
-        fetchChartData(newValue);
-    });
-
-    // Filter and sort products
-    const sortedAndFilteredProducts = computed(() => {
-        let filtered = [...topProducts.value];
-
-        if (filterOptions.value.category) {
-            filtered = filtered.filter(
-                (product) => product.category === filterOptions.value.category
-            );
-        }
-
-        return filtered.sort((a, b) => {
-            const aValue = a[sortOptions.value.field];
-            const bValue = b[sortOptions.value.field];
-
-            return sortOptions.value.order === 'asc' ?
-                aValue - bValue :
-                bValue - aValue;
-        });
-    });

package/app/components/categories/chart/add-chart.vue

@@ -1,142 +0,0 @@
-<template>
-    <div>
-        <form @submit.prevent="createActivityAndRefresh">
-            <v-card>
-                <v-card-text>
-                    <v-text-field v-model="chartData.name" id="chartName" label="Chart Name*" required />
-                    <v-textarea v-model="chartData.description" label="What's happening?*" variant="outlined"
-                        required></v-textarea>
-                    <v-row>
-                        <v-col cols="6">
-                            <v-select v-model="chartData.type" label="What type of chart is this?"
-                                :items="['Notes', 'News']" />
-                        </v-col>
-                        <v-col cols="6">
-                            <v-select v-model="chartData.status" label="Is this chart public or private?"
-                                :items="['Public', 'Private']" />
-                        </v-col>
-                        <v-col cols="12">
-                            <v-file-input @change="handleImageUpload" clearable density="compact"
-                                prepend-icon="fas fa-image" accept="image/*" label="Image" variant="solo-inverted" />
-                        </v-col>
-                    </v-row>
-                </v-card-text>
-                <v-divider class="mt-12"></v-divider>
-                <v-card-actions>
-                    <v-btn color="blue-darken-1" variant="text" @click="dialog = false">
-                        Close
-                    </v-btn>
-                    <v-spacer></v-spacer>
-                    <v-btn color="blue-darken-1" variant="text" type="submit" @click="reset = false">
-                        Reset
-                    </v-btn>
-                    <v-btn color="blue-darken-1" variant="text" type="submit" @click="createNewChart">
-                        Create
-                    </v-btn>
-                </v-card-actions>
-            </v-card>
-        </form>
-    </div>
-</template>
-
-<script>
-    export default {
-        methods: {
-            reset() {
-                this.$refs.form.reset()
-            },
-        },
-    }
-</script>
-
-<script setup>
-    import {
-        ref
-    } from 'vue';
-    import {
-        useRoute    } from 'vue-router';
-    import uploadFiles from '#shared/app/composables/globals/uploadFiles';
-    import createChart from '@/composables/charts/createChart';
-
-    // Make sure your props are properly defined
-    // Update props to include spaces_id
-    const props = defineProps({
-        spaces_id: {
-            type: String,
-            required: true
-        }
-    });
-
-    const { user } = useSupabaseAuth()
-
-    const route = useRoute();
-
-
-    const chartData = ref({
-        name: '',
-        description: '',
-        type: '',
-        status: '',
-        image: '',
-        reactions: '',
-        color: '',
-        coverFile: null,
-        avatarFile: null,
-        creator: user?.email,
-    })
-
-    const dialog = ref(false);
-
-    const imageFile = ref(null);
-    const documentFile = ref(null);
-
-    // Emit event for parent component updates
-    const emit = defineEmits(['chart-created']);
-
-    const handleImageUpload = (event) => {
-        imageFile.value = event.target.files[0];
-    };
-
-
-    const createNewChart = async () => {
-    try {
-        // Upload files if any
-        const uploadedFiles = await uploadFiles({
-            imageFile: imageFile.value,
-            documentFile: documentFile.value,
-        });
-
-        // Update chart data with uploaded files
-        if (uploadedFiles) {
-            chartData.value.image = uploadedFiles.imageId;
-            chartData.value.media = uploadedFiles.documentId;
-        }
-
-        // Set spaces_id in chartData to link chart to the space
-        chartData.value.spaces_id = props.spaces_id;
-
-        // Create the chart with space relationship
-        const chart = await createChart(chartData.value);
-
-        console.log('Created Chart:', chart);
-
-        // Emit event to refresh parent component
-        emit('chart-created', chart);
-
-        // Close dialog and reset form
-        dialog.value = false;
-        reset();
-
-        // Optional: Redirect to the space page
-        router.push(`/departments/categories/chart/${props.spaces_id}`);
-    } catch (error) {
-        console.error('Error creating chart:', error);
-        // Add error handling here
-    }
-};
-
-    // Add watch to update spaces_id if props change
-    watch(() => props.spaces_id, (newSpaceId) => {
-        chartData.value.spaces_id = newSpaceId;
-    });
-</script>

package/app/components/categories/chart/chart.vue

@@ -1,82 +0,0 @@
-<template>
-    <div class="contentPage">
-        <v-toolbar :style="`background-color: ${chart?.color}`" :title="chart?.name"></v-toolbar>
-        <v-table class="charttable">
-            <thead>
-                <tr>
-                    <th></th>
-                    <th class="text-left">
-                        This Week
-                    </th>
-                    <th class="text-left">Name</th>
-                    <th class="text-left">
-                        Award
-                    </th>
-                    <th class="text-left">
-                        Last Week
-                    </th>
-                    <th class="text-left">
-                        Peak Position
-                    </th>
-                    <th class="text-left">
-                        Weeks on Chart
-                    </th>
-                    <th class="text-left">
-                        Buy
-                    </th>
-                    <th class="text-left"><share /></th>
-                </tr>
-            </thead>
-            <tbody>
-                <tr v-for="(products, index) in chart?.products?.products_id" :key="index">
-                    <td class="chartnumber">
-                        <h1>{{ chart?.thisWeek }}</h1>
-                    </td>
-                    <td>
-                        <v-avatar :image="products?.image?.filename_disk" rounded="0" size="130"></v-avatar>
-                    </td>
-                    <td>
-                        <v-list>
-                            <v-list-item>
-                                <v-list-item-title>{{ products?.name }}</v-list-item-title>
-                                <div v-for="product in products?.product_types?.product_types_id" :key="product">
-                                  <v-list-item-subtitle>{{ product?.name }}</v-list-item-subtitle>  
-                                </div>
-                            </v-list-item>
-                        </v-list>
-                    </td>
-                    <td>
-                        <v-avatar icon="fas fa-star" :style="`color: ${chart?.award}`"></v-avatar>
-                    </td>
-                    <td>
-                        <h5>{{ chart?.last_week }}</h5>
-                    </td>
-                    <td>
-                        <h5>{{ chart?.peak_position }}</h5>
-                    </td>
-                    <td>
-                        <h5>{{ chart?.weeks_on_chart }}</h5>
-                    </td>
-                    <td>
-                        <v-btn href="" icon="fas fa-shopping-cart"></v-btn>
-                    </td>
-                </tr>
-            </tbody>
-        </v-table>
-        <relatedchart />
-        <relatedproducts /><!---->
-        <recentlyviewed /><!---->
-    </div>
-</template>
-
-<script setup>
-    import share from '#social/app/components/blocks/share.vue'
-    import relatedchart from '../../related/relatedcharts.vue'
-    import relatedproducts from '#commerce/app/components/related/relatedproducts.vue'
-    import recentlyviewed from '#commerce/app/components/catalog/product/recentlyviewed.vue'
-
-
-useHead({
-    title: computed(() => chart?.value?.name || 'Chart Page')
-  });
-</script>

package/app/components/categories/chart/monthlyChart.vue

@@ -1,46 +0,0 @@
-<template>
-    <v-table fixed-header>
-        <thead>
-            <tr>
-                <th class="text-left">Position</th>
-                <th class="text-left">Product</th>
-                <th class="text-left">Sales</th>
-                <th class="text-left">Last Week</th>
-                <th class="text-left">Peak Position</th>
-                <th class="text-left">Weeks on Chart</th>
-                <th class="text-left">Trend</th>
-            </tr>
-        </thead>
-        <tbody>
-            <tr v-for="(product, index) in data" :key="product.id">
-                <td>{{ index + 1 }}</td>
-                <td>
-                    <div class="d-flex align-center">
-                        <v-img :src="product.image" width="50" height="50" class="mr-3" />
-                        <div>
-                            <div class="font-weight-bold">{{ product.name }}</div>
-                            <div class="text-caption">{{ product.category }}</div>
-                        </div>
-                    </div>
-                </td>
-                <td>{{ product.sales }}</td>
-                <td>
-                    <v-chip :color="getPositionColor(product.lastWeek, index + 1)" size="small">
-                        {{ product.lastWeek }}
-                    </v-chip>
-                </td>
-                <td>{{ product.peakPosition }}</td>
-                <td>{{ product.weeksOnChart }}</td>
-                <td>
-                    <v-icon :color="getTrendColor(product.trend)">{{ getTrendIcon(product.trend) }}</v-icon>
-                </td>
-            </tr>
-        </tbody>
-    </v-table>
-</template>
-
-<script setup>
-    defineProps({
-        data: Array, // Accepts the chart data
-    });
-</script>

package/app/components/categories/chart/weeklyChart.vue

@@ -1,46 +0,0 @@
-<template>
-    <v-table fixed-header>
-        <thead>
-            <tr>
-                <th class="text-left">Position</th>
-                <th class="text-left">Product</th>
-                <th class="text-left">Sales</th>
-                <th class="text-left">Last Week</th>
-                <th class="text-left">Peak Position</th>
-                <th class="text-left">Weeks on Chart</th>
-                <th class="text-left">Trend</th>
-            </tr>
-        </thead>
-        <tbody>
-            <tr v-for="(product, index) in data" :key="product.id">
-                <td>{{ index + 1 }}</td>
-                <td>
-                    <div class="d-flex align-center">
-                        <v-img :src="product.image" width="50" height="50" class="mr-3" />
-                        <div>
-                            <div class="font-weight-bold">{{ product.name }}</div>
-                            <div class="text-caption">{{ product.category }}</div>
-                        </div>
-                    </div>
-                </td>
-                <td>{{ product.sales }}</td>
-                <td>
-                    <v-chip :color="getPositionColor(product.lastWeek, index + 1)" size="small">
-                        {{ product.lastWeek }}
-                    </v-chip>
-                </td>
-                <td>{{ product.peakPosition }}</td>
-                <td>{{ product.weeksOnChart }}</td>
-                <td>
-                    <v-icon :color="getTrendColor(product.trend)">{{ getTrendIcon(product.trend) }}</v-icon>
-                </td>
-            </tr>
-        </tbody>
-    </v-table>
-</template>
-
-<script setup>
-    defineProps({
-        data: Array, // Accepts the chart data
-    });
-</script>

package/app/components/categories/chart/yearlyChart.vue

@@ -1,46 +0,0 @@
-<template>
-    <v-table fixed-header>
-        <thead>
-            <tr>
-                <th class="text-left">Position</th>
-                <th class="text-left">Product</th>
-                <th class="text-left">Sales</th>
-                <th class="text-left">Last Week</th>
-                <th class="text-left">Peak Position</th>
-                <th class="text-left">Weeks on Chart</th>
-                <th class="text-left">Trend</th>
-            </tr>
-        </thead>
-        <tbody>
-            <tr v-for="(product, index) in data" :key="product.id">
-                <td>{{ index + 1 }}</td>
-                <td>
-                    <div class="d-flex align-center">
-                        <v-img :src="product.image" width="50" height="50" class="mr-3" />
-                        <div>
-                            <div class="font-weight-bold">{{ product.name }}</div>
-                            <div class="text-caption">{{ product.category }}</div>
-                        </div>
-                    </div>
-                </td>
-                <td>{{ product.sales }}</td>
-                <td>
-                    <v-chip :color="getPositionColor(product.lastWeek, index + 1)" size="small">
-                        {{ product.lastWeek }}
-                    </v-chip>
-                </td>
-                <td>{{ product.peakPosition }}</td>
-                <td>{{ product.weeksOnChart }}</td>
-                <td>
-                    <v-icon :color="getTrendColor(product.trend)">{{ getTrendIcon(product.trend) }}</v-icon>
-                </td>
-            </tr>
-        </tbody>
-    </v-table>
-</template>
-
-<script setup>
-    defineProps({
-        data: Array, // Accepts the chart data
-    });
-</script>