Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/braunstetter/controlpanelbundle
A wonderful and extensible responsive control panel for your software ecosystem with symfony.
https://github.com/braunstetter/controlpanelbundle
control-panel ecosystem symfony twig
Last synced: 12 days ago
JSON representation
A wonderful and extensible responsive control panel for your software ecosystem with symfony.
- Host: GitHub
- URL: https://github.com/braunstetter/controlpanelbundle
- Owner: Braunstetter
- Created: 2021-08-13T15:42:11.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2022-06-25T09:12:45.000Z (over 2 years ago)
- Last Synced: 2024-04-04T04:21:09.205Z (8 months ago)
- Topics: control-panel, ecosystem, symfony, twig
- Language: PHP
- Homepage:
- Size: 3.12 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# ControlPanelBundle
[![Build Status](https://app.travis-ci.com/Braunstetter/ControlPanelBundle.svg?branch=main)](https://app.travis-ci.com/Braunstetter/ControlPanelBundle)
[![Total Downloads](http://poser.pugx.org/braunstetter/control-panel-bundle/downloads)](https://packagist.org/packages/braunstetter/control-panel-bundle)
[![License](http://poser.pugx.org/braunstetter/control-panel-bundle/license)](https://packagist.org/packages/braunstetter/control-panel-bundle)Sometimes you don't want to commit to a complete admin system. But you would like to have a nice admin panel structure
ready to be extended.## Installation
```shell
composer require braunstetter/control-panel-bundle
yarn install --force
```## What's inside
### Templates
- [layouts/base.html.twig](Resources/views/layouts/base.html.twig) (Mobile structure - but empty)
- [base.html.twig](Resources/views/base.html.twig) (contains structure with template hooks)You can extend these templates, but you can also use
the [braunstetter/template-hooks-bundle](https://github.com/Braunstetter/TemplateHooksBundle) whose hooks are used
inside of the `base.html.twig` file.### FormTypes
This bundle comes with several [custom form types](https://symfony.com/doc/current/form/create_custom_field_type.html).
To show you how you can use it, I want to show you an [example](#pagetype-example)._To make this work you need an `OrangePuppy` [Entity](https://symfony.com/doc/current/doctrine.html#creating-an-entity-class) with a title and a description property on it._
## Example - Up and running a fully working controlpanel
### Create a new symfony project.
```shell
symfony new --full my_project
composer install
```### Setup the database
For this simple test just use a sqlite database by changing the `.env` file to:
```dotenv
DATABASE_URL="sqlite:///%kernel.project_dir%/var/data.db"
# DATABASE_URL="mysql://db_user:[email protected]:3306/db_name?serverVersion=5.7"
#DATABASE_URL="postgresql://db_user:[email protected]:5432/db_name?serverVersion=13&charset=utf8"
###< doctrine/doctrine-bundle ###
```````shell
symfony console doctrine:database:create
````### Create a Controller with a route
```shell
symfony console make:controllerChoose a name for your controller class (e.g. DeliciousElephantController):
> SiteControllercreated: src/Controller/SiteController.php
created: templates/site/index.html.twig
Success!
```
### Edit the twig template
Change `templates/site/index.html.twig`:
```html
{% extends '@ControlPanel/base.html.twig' %}{% block title %}Hello SiteController!{% endblock %}
{% block content %}
```> Note: don't forget to change the block name from `body` to `content`
### Start the webserver and visit your control panel
```shell
symfony serve -d
```Now you can see the result by visiting the `/site` url.
![Empty control panel](docs/images/empty_control_panel.png)
## PageType Example
```php
add('title');
}public function buildSidebarForm(FormInterface $builder, array $options)
{
$builder->add('sideBox', TestBoxType::class);
}public function buildToplineRightForm(FormInterface $builder, array $options)
{
$builder->add('submit', SubmitType::class, ['attr' => ['class' => 'cp-button-default']]);
}public function configureOptions(OptionsResolver $resolver)
{
$resolver->setDefaults([
'title' => 'Create a new OrangePuppy',
'data_class' => OrangePuppy::class,
]);
}public function getParent()
{
return PageType::class;
}
}
```And here comes the explanation.
1. Extend `Braunstetter\ControlPanel\Form\PageType;` (for additional build-methods)
2. Set the title as an option (Either by submitting the option when creating the form, or by setting it inside
the [`configureOptions` method](https://symfony.com/doc/current/forms.html#passing-options-to-forms))
3. Overwrite `public function getParent()` to get view variables and the theme block_prefix inheritance (basically make
the styling working ;)
4. Use the public `buildBodyForm`, `buildSidebarForm`, `buildToplineRightForm`, `buildToplineLeftForm` methods to fill
the form.The result:
![page form result](./docs/images/page_form_result.png)> The `cp-button-default` is a [custom button class](src/Resources/assets/css/elements/buttons.css) this bundle provides.
> The nice menu on the left side is provided by the [braunstetter/menu-bundle](https://github.com/Braunstetter/menu-bundle).
### BoxType
Maybe you ask yourself where the nice sidebar box is coming from. And probably you recognized the `TestBoxType` inside the `buildSidebarForm` method.
This is the second custom FormType this bundle provides. Here is an example:```php
add('description', TextType::class);
}public function getParent(): string
{
return BoxType::class;
}
}
```This time you just have to overwrite the `getParent()` and return the `Braunstetter\ControlPanel\Form\BoxType`. (Because this FormType has no special methods.)
> The BoxType has the symfony [inherit_data](https://symfony.com/doc/current/form/inherit_data_option.html) option active by default. This way you can just use it just like you put the forms inside the parent class themselves.