Change table row color based on condition of another table

[dru_nasty]

I have a table component (table23) that has entries of job tickets. I have another table component (table24) that has all tasks associated with the job from table23. Both of which have primary and foreign key associations.
Their respective table names in the database are "maintenance_requests" and "dispatched_tasks".

I'm using a Progress Circle component to show when all tasks are complete for a job (this changes on whichever row i have selected on table23.

{{ (table24.data.filter(row => row.maintenance_status === 'Complete').length / table24.data.length) * 100 }}`Preformatted text

What i want, is to change the row color in table23 whenever all tasks in table24 are "Complete".

Trying many different approaches but nothing working, I think a different way to think about this, any help is appreciated.

[ScottR]

Is the progress checked in real time... in other words is table23 being changed and then table24 should reflect the change made?
Also, any screenshots possible to share?

[dru_nasty]

Yes real time check on the progress circle.

The first screenshot here shows the work orders tab (table24), where work order status is updated in real time by a save as query.

The next screenshot shows details in the ticket info tab with the progress circle updated to show all work orders were completed.

Besides the progress circle, i'd also like the row for ticket id 190 (table23) to be highlighted.
This was it's another visual indication that this job ticket has all work orders completed.

[ScottR]

Yes, I have seen this before and I believe that since the table is in one tab and the other table/progress circle is in another tab, the two cannot "meet" shall we say or connect to one another in order to get values from either table or statuses, etc. but I think it was solved but cannot recall when and who posted it....

Have you tried simply doing the following for the row color change or for the progress circle....

{{table23.selectedRow.status}} and see what you get?

[dru_nasty]

The progress circle works fine with this code in its value.

@dru_nasty

{{ (table24.data.filter(row => row.maintenance_status === 'Complete').length / table24.data.length) * 100 }}`Preformatted text

There could be multiple work orders within one ticket, all having different status. The progress circle works great on reflecting the percentage of total work orders that are complete. Once all are complete i don't have a way to change the tickets row color.

I'm think i might need to run a completely separate query and have a column in my tickets table that holds total done. I'm not sure.

[ScottR]

OK in a temp state (variable) do the following
{{table24.selectedRow.status === 'Complete'?'blue':'red'}} /// whatever color you choose....

then in table 23 in the Row color field add {{your_variable_name.value}}

[dru_nasty]

Not sure if this is set up right. I set up a variable called completeColor, then set table23's row color to completeColor.value.

Getting error on the row color 'completeColor' is not defined.

[dru_nasty]

Actually, it works but it just sets all rows in table23 to blue.

[ScottR]

OK so you want a specific row color in table 23 to change, right.... and unfortunately, I don't believe there is a way to do that on a row by row basis.... at least I cannot figure it out based on what the new table component is showing me what is available....

[dru_nasty]

Ok thanks for helping me look into that. I'm thinking i'll try to run a query to change another status column in table23 upon triggering the initial status update in table24.

[Oscar_Ortega]

Hello, this was my approach

test.json (22.0 KB)

Get general status of the tasks

{{
  jsonEditor2.value.status.reduce((acc, val, index) => { // get the sum of all percents
    if (jsonEditor2.value.job_id[index] === currentSourceRow.id) {
      return acc += val
    }
    return acc
  }, 0) / jsonEditor2.value.job_id.reduce((acc, val) => { // divide by the amount of records to get the average percent
    if (val === currentSourceRow.id) {
      return acc += 1
    }
    return acc
  }, 0)
}}

Coloring the row

{{ currentRow.generalStatus === 1 ? "#00ff0010" : "" }}

[dru_nasty]

I ended up just adding a query to run after a status update is made on my work orders to update my main ticket table. The main ticket table has a hidden checkbox column 'all_tasks_complete' that i use to change the color of the row.

{{ currentSourceRow.all_tasks_complete ? '#bdfed7' : '' }}