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: about 1 month 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 (almost 5 years ago)
- Default Branch: main
- Last Pushed: 2022-06-25T09:12:45.000Z (almost 4 years ago)
- Last Synced: 2025-02-14T15:44:16.721Z (over 1 year 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
[](https://app.travis-ci.com/Braunstetter/ControlPanelBundle)
[](https://packagist.org/packages/braunstetter/control-panel-bundle)
[](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:db_password@127.0.0.1:3306/db_name?serverVersion=5.7"
#DATABASE_URL="postgresql://db_user:db_password@127.0.0.1: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:controller
Choose a name for your controller class (e.g. DeliciousElephantController):
> SiteController
created: 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.
## 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:
> 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.