iakovos/wireui-smart-table
Composer 安装命令：
composer require iakovos/wireui-smart-table
包简介
Simple yet effective and fully configurable component for all CRUD operations. A Laravel - Livewire component that can intuitively present model data in a table (or create/update/delete forms) using Tailwind and WireUI with minimal component configuration while also maintaining fully scalable, exten
关键字：
README 文档
README
Simple yet effective and fully configurable component for all CRUD operations. A Laravel - Livewire - WireUI component that can intuitively present model data in a table (or create/update/delete forms) using Tailwind and WireUI with minimal component configuration while also maintaining fully scalable, extendable and configurable capabilities. It also comes with optional built-in smart-forms that facilitate all CRUD operations.
- Features
- Actual example
- Installation
- Example usage
- Available configs
i. Table
ii. Form - Events & Listeners
i. Table
ii. Form
Features
- Auto detect column models (except enums)
- Search columns depending on their type with text, select, number input etc.
- Sort/Group by column asc/desc/null
- Paging
- Column visibility
- Add / edit / delete object forms
- State save
- Context menu (right click)
Actual example
Auto created table just by giving the model class
<livewire:wire-ui-smart-table
table_core_db_model="WireUiSmartTable\\Models\\TestModel"
table_features_use_fillable="false"
table_columns_enums='{"test_enum":"WireUiSmartTable\\\\Enums\\\\TestEnum::cases"}'
/>
Auto created form just by giving the model class
<livewire:wire-ui-smart-form
form_core_db_model="WireUiSmartTable\\Models\\TestModel"
form_columns_enums='{"test_enum":"WireUiSmartTable\\\\Enums\\\\TestEnum::cases"}'
/>
Installation
Follow this steps to install the packages into your laravel project
Do not forget WireUI installation instructions see https://v1.wireui.dev/docs/get-started#installation
- composer require iakovos/wireui-smart-table
- Install Tailwind CSS (see https://tailwindcss.com/docs/installation)
- npm install livewire-sortable --save-dev (see https://github.com/livewire/sortable)
- Import livewire-sortable package in your bundle (app.js):
import 'livewire-sortable'
// Or.
require('livewire-sortable') - Add @stack('wire-ui-smart-scripts') after livewire and WireUI scripts on your root document template
Example usage
Simplest example usage for a model that has 1 enum property is
<livewire:wire-ui-smart-table
table_core_db_model="App\\Models\\User"
table_columns_enums='{"department_type":"App\\\\Enums\\\\DepartmentTypes::cases"}'
/>
or prettier
<livewire:wire-ui-smart-table
table_core_db_model="$mymodel"
table_columns_enums='{{ json_encode($enums) }}'
/>
Available configurations
The only required configuration for your component is the livewire properties table_core_db_model and table_columns_enums (if any). Smart table will auto-detect all columns and relations on the model and display a table with columns, filters, sorting, paging, visibility and grouping (more to be added later)
All templates can be changed either by changing the path to the desired variable template or by publishing the templates and changing them.
In case you wish to show certain columns or wish to configure it further here are all the configuration options (all options are livewire component attributes) :
Table Configs
Required
| Livewire property name | Definition |
|---|---|
| table_core_db_model | The main model for which the table is used for e.g. App\Models\User |
| table_columns_enums | (if any) Declare a column as enum, path\to\a\class::cases should return available cases of an enum e.g. {"User.column_name":"path\\\\to\\\\a\\\\enum\\\\class::cases"} |
Optional / auto-detected
| Livewire property name | Definition |
|---|---|
| table_columns_columns | The columns you wish to show. e.g. table_columns_columns='["id","name","relationName.id","relationName.some_column"]' |
| table_columns_booleans | A flat array of boolean column names e.g. ["column_1","relation.column_2"] |
| table_columns_integers | A flat array of numeric columns names e.g. ["column_1","relation.column_2"] |
| table_columns_datetimes | A flat array of columns that should appear with datepicker filtering e.g. ["column_1","relation.column_2"] |
| table_relations_files | A flat array containing the names of file relations. Relations must be of HasMany type and file model should have at least the following columns: name, path, size, category |
| builder_filters | a function to be called for hard-filtering rows (e.g. according to application user rights) e.g. builder_filters="App\\Http\\Controllers\\UserResourceController::applyLogicFilters", defined as function applyLogicFilters($builder):Builder MUST return builder |
| table_relations_filters | An associated array that defines which function to call to add filters for a given column dropdown e.g. table_relations_filters={"broker_id":"App\\\\Http\\\\Controllers\\\\UserResourceController::applyColumnFilters"} defined as function applyColumnFilters($column_name, $builder):Builder MUST return builder |
| table_features_use_fillable | Use laravel fillable (if false finds all columns from schema) if columns were not defined |
| table_features_search | Search state variable |
| table_features_columns_visibility | Visibility state variable. |
| table_features_replaces | Most (if not all) of the times column names are not user-friendly. Smart table will auto-convert column name " relationName.some_column" to "Relation Name Some Column" but just in case that is not enough you can declare the columns however you want e.g. {"relationName.some_column":"My new column"} |
| table_features_group_properties | A flat array of column names initially used for grouping |
| table_settings_default_datetime_format | The datetime format to use on table. default is 'd-m-Y' |
| table_settings_default_datepicker_format | The datetime format to use on datepickers. default is 'DD-MM-YYYY' |
| table_settings_enable_groups | Enable or disable group on request. default is true |
| table_settings_show_clear_filter | Show or hide the clear filters button. default is true |
| table_settings_show_loading | Show or hide loading spinners. default is true |
| table_settings_show_filters | Show or hide column filters. default is true |
| table_settings_enable_joined_groups | Allow or not using more than 1 column for groups. default is false |
| table_settings_save_state | Persist current table state on database per account/model. default is true |
| table_templates_top_toolbox | The template that includes all the top section above the actual table with its components |
| table_templates_top_right_buttons | The buttons template to use on the top right of table for row actions |
| table_templates_header_row | Includes all the th headers |
| table_templates_filters_style | Selects style for filters, on every table column or a dropdown, valid values="dropdown" or "table", default table |
| table_templates_filters_row | The table row containing all header filters in case of table style |
| table_templates_filters_integer | Template for integer column filter |
| table_templates_filters_enum | Template for enum column filter |
| table_templates_filters_datetime | Template for datetime column filter |
| table_templates_filters_boolean | Template for boolean column filters |
| table_templates_filters_string | Template for string column filters |
| table_templates_filters_select_multiple | Template for relation filters |
| table_templates_data_group_row | Template for table group |
| table_templates_data_row | Template for table row |
| table_templates_cell_id_checkbox | Template for first cell containing the select row checkbox |
| table_templates_cell_checkbox | Template for boolean cells |
| table_templates_cell_array | Template for cell containing many values e.g. a m2m relationship |
| table_templates_cell_string | Template for string cells |
| table_templates_context_menu | The buttons template to use as context menu when right-clicking a row |
Form Configs
Required
| Livewire property name | Definition |
|---|---|
| form_core_db_model | The main model for which the table is used for e.g. App\Models\User |
| form_columns_enums | (if any) Declare a column as enum, path\to\a\class::cases should return available cases of an enum e.g. {"User.column_name":"path\\\\to\\\\a\\\\enum\\\\class::cases"} |
Optional / auto-detected
| Livewire property name | Definition |
|---|---|
| form_features_replaces | Most (if not all) of the times column names are not user-friendly. Smart table will auto-convert column name " relationName.some_column" to "Relation Name Some Column" but just in case that is not enough you can declare the columns however you want e.g. {"relationName.some_column":"My new column"} |
| form_features_use_fillable | use model fillables otherwise detect columns from schema |
| form_columns_columns | The columns you wish to show. e.g. table_columns_columns='["id","name","relationName.id","relationName.some_column"]' |
| form_columns_booleans | A flat array of boolean column names e.g. ["column_1","relation.column_2"] |
| form_columns_integers | A flat array of numeric columns names e.g. ["column_1","relation.column_2"] |
| form_columns_datetimes | A flat array of columns that should appear as datepicker |
| form_columns_texts | A flat array of columns that should appear as textarea |
| form_relations_files | A flat array containing the names of file relations. Relations must be of HasMany type and file model should have at least the following columns: name, path, size, category |
| form_default_columns_spans | The number of grid columns to use defaults to 4 |
| form_columns_spans | An associative array of column_name=>grid-col-span for each property defaults to 1 |
| form_columns_hidden | A flat array of column names to hide |
| form_relations_hidden | A flat array of relation names to hide |
| form_enum_options | An associative array of arrays containing the enum values (not needed if form_columns_enums are defined |
| form_attributes | The columns that are being used by the component after auto-detection or json deserialization |
| form_settings_layout_type | The form layout type defaults to "single" but will support "tabs" in the near future |
| form_rules_create | Validation rules used when creating a new item |
| form_rules_update | Validation rules used when editing an item |
| form_events_creating | Function to be called before creating an object e.g. form_events_creating="App\\Livewire\\Calendar::creatingNewChecklist" MUST RETURN THE ITEM ITSELF |
| form_events_created | Function to be called after creation of an object MUST RETURN THE ITEM ITSELF |
| form_events_updating | Function to be called before updating an object MUST RETURN THE ITEM ITSELF |
| form_events_updated | Function to be called after updating an object MUST RETURN THE ITEM ITSELF |
| form_events_deleting | Function to be called before deleting an object |
| form_events_deleted | Function to be called after deletion of an object |
| template_layout_single_add | Template used for add form |
| template_layout_single_edit | Template used for edit form |
| template_relation_file | Template used for file relation |
| template_attribute_boolean | Template used for boolean attributes |
| template_attribute_datetime | Template used for datetime attributes |
| template_attribute_enum | Template used for enum attributes |
| template_attribute_integer | Template used for integer attributes |
| template_attribute_select_multiple | Template used for many to many relation attributes |
| template_attribute_select_single | Template used for single select relation and enum attributes |
Events and Listeners
1. Table
| Event name | Definition |
|---|---|
| refresh | Refreshes the table |
| setSelectedIds(array $ids) | Set the selected/checked ids on table e.g. [5=>true, 17=>true] |
| rowClicked($id) | Signal that a row with $id has been clicked |
2. Form
| Event name | Definition |
|---|---|
| openSmartForm | Shows the form |
| rowClicked($id) | Signal that a row with $id has been clicked |
| deleteItem | Deletes the item with id defined by rowClicked |
iakovos/wireui-smart-table 适用场景与选型建议
iakovos/wireui-smart-table 是一款 基于 PHP 开发的 Composer 扩展包，目前已累计 17 次下载、GitHub Stars 达 0， 最近一次更新时间为 2024 年 07 月 23 日， 在 PHP 生态内属于活跃度较高的组件。
它主要适用于以下技术方向： 「admin」 「crud」 「laravel」 「datatables」 「tailwind」 「blade components」 等业务场景。在实际项目中，围绕这些方向常见需要落地的问题包括：接口对接、性能调优、并发安全、与既有框架（Laravel / ThinkPHP / Yii / Webman 等）的兼容适配，以及生产环境的日志埋点与稳定性保障。
我们在过去多个企业项目中使用过 iakovos/wireui-smart-table 或与其功能相近的方案，如果你在选型或落地过程中遇到问题，例如 版本兼容、二次改造、私有化封装、与内部系统对接、生产 BUG 排查，欢迎联系我们协助评估。
基于 iakovos/wireui-smart-table 在你已有业务上做功能扩展、字段裁剪、UI 适配、与内部账号 / 权限 / 日志系统的深度对接。
线上偶发问题、内存泄漏、慢查询、并发异常等排查修复；针对高流量场景做缓存、队列、索引层面的调优。
承接完整的项目从需求 → 设计 → 开发 → 上线 → 长期运维；也可按月提供技术保姆服务。
与 iakovos/wireui-smart-table 相关的其它包
同方向 / 同关键字的高下载量 PHP Composer 包推荐，方便对比选型：
Gii Generator for double model generation
2lenet/EasyAdminPlusBundle
Analysis module for finding problematical shop data.
A PSR-7 compatible library for making CRUD API endpoints
Admin panel generator for Laravel 8 and based on Vuetify Admin, a separate SPA admin framework running on top of REST APIs.
Collection of tools to use the full power of the Enyalius framework
统计信息
- 总下载量： 17
- 月度下载量： 0
- 日度下载量： 0
- 收藏数： 0
- 点击次数： 26
- 依赖项目数： 0
- 推荐数： 0
其他信息
- 授权协议： MIT
- 更新时间： 2024-07-23