table inside tabs its possible?
hi im trying to recreate my app currently in native php to filament
its like attached image it have tabs inside tabs and also a table with some invoice data from a mysql db. how i can achieve that? thank you
26 Replies
Any idea or tip? Thank you
I may be wrong, but your top level tabs seem to more of a top Navigation? In that case you can use ->topNavigation() on your Filament PanelProvider to get a similar effect, although I think the default sidebar nav is more flexible and generally a better approach for a Filament app.
Also, while you can likely achieve something close to your screenshot by creating custom Pages and a blade template wrapper, it will probably take a lot more work to get there vs. leveraging the UX of Filament's built-in layout + components.
The top level are regular tabs when i click a client in a table it open that window to get details of user
What you can recommend me?
Attached sample flow first click on regular nav bar, show table, open user details with tabs and inside i have lot of info and also tabledd
Tables
You’ll definitely need to use a custom page for this with either filament components or your own components as wrappers around the form / table livewire components. It can be done, but yea, this is a complicated layout that will require some work but it can be done.
And maybe i can change layout? To make it easier? I mean im open to any ideas. As this is a very old system with pure php but the deal i dont have source code thats why i need to migrate to filament
With a custom page the layout of the content is anything you want it to be
Assume these are different tables\models.
A combination of top navigation and clusters could get you close.
Possibly, I think the problem with top navigation though, if I’m understanding correctly is that top navigation is global, and I think this is relative to specific ‘resource’
The top navigation have the same tabs for all clients. Of course the info changes per client. Im thinking if theres any other layout i can use
Not to sound contrite but yes. A custom one.
But I could very well be missing the point.
To me, personally, structure seems like Relation Managers for the User Edit, if you want to view the tables of Invoices and other data for that specific customer. See this in the official Filament demo: https://demo.filamentphp.com/shop/customers/1/edit
You can make this very easily, using
topNavigation and then clusters, which give something similar to the OP request.
I would very much warn against taking on a project to replicate something legacy that aims to faithfully replicate the original product. Especially if you are then going to use a framework to try and do it. You'll just end up painting yourself into a corner.
Be much wiser to understand what the customer wants, and give them a new solution that plays to the strengths of the environment you intend to deploy. If the legacy product is old, the business case will have moved on aswell anyway.
You right, im the client too is my own soft that someone do in pure php few years ago. i agreed i should take a look and provide new layouts using benefit of filement php
for example this is the main screen
where i select the user to view or edit
here then i edit one user and see details, invoices
general info too
this may works for tabs that have tables, but if you see not all tabs have tables, the first tab have general information of the user name, id, address
sounds good too but no need top navigation, cluster looks good, i can use it so tab 1 may have a table, tab2 may have general info correct? like images attached
Right, I see. Then, if you want to do it completely that way, then it would be probably more like a Livewire project with Filament components, and not a Filament project. A lot of custom things would be needed.
yeah i mean im open, i dont need to make it like the actual system. im looking for recommendations , thats how it looks today but i would like to use filament for this
even if i have to change all layout
with cluster i cant have like one cluster a table, another general info without table etc?
I don't remember by heart, to be honest, would need to re-read the docs and experiment. But my first guess is that you can't do that with clusters. I can actually spend some time trying to recreate the layout you're going for, but will have time for it only in 1-2 weeks, it's not a 5minute task
You can do what you want with a combination of clusters and table widgets and relation managers.
However, using filament panels, you've got access to infolists, modals and slideovers etc, that probably negate the need for many tabs.
Having big forms as part of the display is a bit 2015.
It looks like a failry hefty project. Assuming you've got a bit of time, and your existing system is not about to fall over, you would benefit from getting your filament skills first.
Build a smaller project, or perhaps something that can be separated out completely. By doing so, you'll start to understand how it all fits together, and then when you have built the knowledge, you'll be able to much more easily and quickly build the app you want. It wiull be overall quicker than trying a big project, and doing all the rewrites when you realise something which had previously eluded you.
yeah this project have like 10 years so looks old
thank you all for the good recommendations