callcocam/plannerate

This is my package plannerate

Fund package maintenance!
Claudio Campos

Installs: 104

Dependents: 0

Suggesters: 0

Security: 0

Stars: 0

Watchers: 1

Forks: 0

Open Issues: 0

Language:Vue

dev-master 2025-04-23 21:00 UTC

This package is auto-updated.

Last update: 2025-04-24 14:06:06 UTC


README

Latest Version on Packagist GitHub Tests Action Status GitHub Code Style Action Status Total Downloads

O Plannerate é um sistema de gestão de planogramas para varejo, permitindo criar e gerenciar layouts detalhados de gôndolas, prateleiras e produtos em lojas. Este pacote integra um backend Laravel com um frontend Vue 3, oferecendo uma solução completa e reusável.

Características

  • Sistema completo de gestão de planogramas
  • Interface Vue 3 com componentes reutilizáveis
  • Sistema multitenancy integrado
  • Gerenciamento de lojas, departamentos, gôndolas, seções e produtos
  • Visualização interativa de layouts

Instalação

1. Instalação via Composer

Instale o pacote via Composer:

composer require callcocam/plannerate

2. Publicação e Execução das Migrações

Publique e execute as migrações para criar as tabelas necessárias:

php artisan vendor:publish --tag="plannerate-migrations"
php artisan migrate

3. Publicação dos Assets e Configurações

# Publicar configurações
php artisan vendor:publish --tag="plannerate-config"

# Publicar assets (CSS, JS)
php artisan vendor:publish --tag="plannerate-assets"

# Publicar views (opcional)
php artisan vendor:publish --tag="plannerate-views"

4. Instalação dos Componentes Frontend

Para projetos que já usam Vue 3, você pode instalá-lo automaticamente usando:

php artisan plannerate:install-frontend

Ou manualmente:

  1. Instale as dependências necessárias:
npm install vue@^3.3.0 vue-router@^4.2.0 pinia@^2.1.0
  1. Compile os assets:
npm run build

Integração com Vue

Opção 1: Usando o Plugin Vue em uma aplicação existente

// Em seu arquivo main.js ou app.js
import { createApp } from 'vue';
import Plannerate from 'plannerate-vue';
import 'plannerate-vue/style.css';

const app = createApp(App);

app.use(Plannerate, {
    baseUrl: '/api',
    tenant: 'default'
});

app.mount('#app');

Opção 2: Uso com Inertia.js

Para projetos Inertia.js:

// Em seu arquivo app.js
import { createApp, h } from 'vue';
import { createInertiaApp } from '@inertiajs/vue3';
import Plannerate from 'plannerate-vue';
import 'plannerate-vue/style.css';

createInertiaApp({
  resolve: name => {
    const pages = import.meta.glob('./Pages/**/*.vue', { eager: true });
    return pages[`./Pages/${name}.vue`];
  },
  setup({ el, App, props, plugin }) {
    const app = createApp({ render: () => h(App, props) });
    
    app.use(plugin);
    app.use(Plannerate, {
      baseUrl: '/api',
      tenant: 'default'
    });
    
    app.mount(el);
  },
});

Opção 3: Usando Componentes Individuais

Você também pode importar componentes específicos:

<script setup>
import { PlannerateApp, ConfirmModal } from 'plannerate-vue';
</script>

<template>
  <PlannerateApp :record="myRecord" />
  <ConfirmModal v-model:isOpen="showConfirm" @confirm="handleConfirm" />
</template>

Uso no Backend Laravel

Controladores

O pacote inclui controladores prontos para uso. Para integrar com seu aplicativo:

// routes/web.php
Route::middleware(['auth'])->group(function () {
    Route::get('/planograms', [App\Http\Controllers\PlanogramController::class, 'index'])->name('planograms.index');
    // Outras rotas conforme necessário
});

Acesso Direto à API

use Callcocam\Plannerate\Facades\Plannerate;

// Obter um planograma
$planogram = Plannerate::getPlanogram($id);

// Criar uma nova gôndola
$gondola = Plannerate::createGondola([
    'planogram_id' => $planogramId,
    'name' => 'Nova Gôndola',
    'num_modulos' => 3
]);

Customização

Temas e Estilos

O pacote usa variáveis CSS que podem ser sobrescritas:

:root {
  --primary-color: #your-primary-color;
  --secondary-color: #your-secondary-color;
}

Configurações

Você pode personalizar o comportamento do pacote editando o arquivo config/plannerate.php:

return [
    'tenant_middleware' => 'tenant', // Middleware para multitenancy (opcional)
    'use_soft_deletes' => true,     // Usar exclusão suave
    'default_scale' => 1,           // Escala padrão para o renderizador
    // Outras configurações
];

Documentação

Para documentação completa, visite a documentação oficial.

Contribuição

Contribuições são bem-vindas! Por favor, veja CONTRIBUTING para detalhes.

Créditos

Licença

Este projeto é licenciado sob a licença MIT. Veja o arquivo LICENSE.md para mais detalhes.