Generating Dynamic Views in Admin on Rest

Question

For both Edit, List and Show, I have dynamic dates that may or may not have values attached to them, I've been willing to render dynamic Custom TextFields, essentially tags but can't seem to get it to work.

Data structure is somehow similar to this:

{
  "id": 1,
  "category_type": "One",
  "category_name": "Type One",
  "prices": [
    {
      "value": 123.00
    },
    {
      "value": 123.00
    },
    {
      "value": 123.00
    }
  ]
},
{
  "id": 2,
  "category_type": "Two",
  "category_name": "Type Two",
  "prices": [
    {
      "value": 123.00
    }
  ]
}

Prices are coming based on a calendar timeframe, index 0 is start date, and end date determines the end of the date. Some dates will have 0 values, others will have value > 0.

The idea here is to produce a great datagrid with dynamic TextFields or TextInputs so Users can view/add/edit prices or zero it based on a start/end date period.

Edit: I've tried to outline the explanation in a mockup:

Your question needs more clarity. 1) Share a snapshot of the design you want to achieve. Also please go through the wording of your question, you are using the word date and price interchangably. — kunal pareek, Aug 01 '17 at 07:30
@kunalpareek I've added a conceptual mockup, that's for the EDIT page with TextInputs. For the List, the dates wouldn't show up, but in EDIT and SHOW pages, they would be visible as TextInputs and TextFields. I hope it is clearer now. — Ernani Joppert, Aug 01 '17 at 11:14

score 1 · Answer 1 · answered Aug 01 '17 at 12:32

1

1) You need to create a custom form. This can be of help to you. See my answer at the bottom of page about creating and using custom Redux Form with AOR.

How to richly style AOR Edit page

2) You will have to create a custom datagrid using material UI table component within this form

3) Edit pages in AOR usually only edit 1 record of your resource. Above it seems you aim to edit multiple record simultaneously. I cannot clearly see a way to achieve that (though it should be possible)

4) AOR List component does not accept Input components because it is not a Redux Form connected component. But your connected DataGrid component that you create for the Edit Page should work as a child of AOR List component allowing you to edit multiple values.

answered Aug 01 '17 at 12:32

kunal pareek

1,285
10
21

For the show part, Is it possible to obtain the record data within a list to iterate prices.values from it? – Ernani Joppert Aug 01 '17 at 12:36
For the #3, actually I am editing 1 record of the result per row if you look closer, but, the idea here is to add a list in edit view to iterate through values and manually add Inputs to it. – Ernani Joppert Aug 01 '17 at 12:39
The Edit Page in AOR retrieves 1 record. What you envision is multiple records being fetched and edited and this will not be easy with the Edit Page and will require a lot of overriding of existing machinery. I suggest you use try and create a custom form component that is tabular in form. You can then use it as a child of List. All records are already present in List. Pass the record to a Redux Form component to Edit them. – kunal pareek Aug 01 '17 at 12:46

Generating Dynamic Views in Admin on Rest

1 Answers1