Update reconciliation view to make use of new $vv_candidate_diff array and use cell-based rather than row-based highlighting. (CO-2481)

app/src/Lib/Match/MatchService.php

@@ -140,8 +140,8 @@ public function diffCandidates(array $original, array $candidates) {
           // out in PHP code. Also, RuleAttributes can affect how matching
           // works, and right now we don't look at those at all.
 
-          $origvalue = $original[$attr];
-          $value = $c[$attr];
+          $origvalue = !empty($original[$attr]) ? $original[$attr] : '';
+          $value = !empty($c[$attr]) ? $c[$attr] : '';
 
           if($attrConfig[$attr]->alphanumeric) {
             $origvalue = preg_replace('/[^A-Za-z0-9]/', '', $origvalue);

app/templates/Matchgrids/reconcile.php

@@ -55,7 +55,7 @@
   array_splice($fieldNames, array_search('referenceid',$fieldNames), 1);
 
   // Build the data for the candidates into a structure for generating the view:
-  // attribute field name | attribute values | do the values match?
+  // String: attribute field name | Array of arrays: [attribute value, candidate id, different?1:0]
   $canAttr = array();
   for($i = 0; $i < count($fieldNames); $i++) {
 
@@ -67,14 +67,12 @@
     foreach($vv_candidates as $c) {
       foreach($c as $key => $val) {
         if($key == $fieldNames[$i]) {
-          $canAttr[$i][1][] = $val;
+          $id = $c['id'];
+          $diff = in_array($key,$vv_candidate_diff[$id]) ? 1 : 0;
+          $canAttr[$i][1][] = [$val, $id, $diff];
         }
       }
     }
-
-    // Test for content and equality between the row's attribute values and
-    // set the third "match?" column to true (1) if non-empty equality found
-    $canAttr[$i][2] = !empty($canAttr[$i][1][0]) && count(ArrayUtil::array_iunique($canAttr[$i][1])) === 1 ? 1 : 0;
   }
 
   // Move request_time and resolution_time to the bottom
@@ -160,8 +158,8 @@
       <?php for($i = 0; $i < count($canAttr); $i++): ?>
         <?php
           $atr = $canAttr[$i][0];
-          // set the row css class
-          // (attribute name + standard, diff, or match)
+          $definedAttr = false;
+          // Set the row css class: 'matr-'+attribute-name plus 'standard' or 'defined-attr'.
           $matchClass = 'matr-' . $atr;
           if(
             $atr == 'id' 
@@ -172,23 +170,35 @@
           ) {
             $matchClass .= ' standard';
           } else {
+            $definedAttr = true;
             $matchClass .= ' defined-attr';
-            $matchClass .= ($canAttr[$i][2] ? ' match' : ' diff');
           }
         ?>
         <tr class="<?= $matchClass ?>">
           <th class="attr-title" scope="row"><?= $canAttr[$i][0] ?></th>
           <?php foreach($canAttr[$i][1] as $key => $val): ?>
-            <td>
+            <?php
+              // Set the cell css class: standard, new, diff, or match
+              // Only defined attributes are given the diff or match classes used for highlighting.
+              // The others are marked as "standard" and the new record is marked as "new".
+              $matchClass = 'standard';
+              if($key == 0) {
+                // The first column is our potentially new record
+                $matchClass = 'new';
+              } elseif($definedAttr) {
+                $matchClass = ($val[2] ? 'diff' : 'match');  
+              }
+            ?>
+            <td class="<?= $matchClass ?>">
               <?php if($atr == 'id'): ?>
                 <?= $this->Html->link(
-                  $val, 
+                  $val[0], 
                   ['controller' => 'matchgrid-records', 
                    'action' => 'edit', 
-                   $val, 
+                   $val[0], 
                    '?' => ['matchgrid_id' => $vv_cur_mg->id]]); ?>
               <?php else: ?>
-                <?= $val; ?>
+                <?= $val[0]; ?>
               <?php endif; ?>
             </td>
           <?php endforeach; ?>

app/webroot/css/co-base.css

@@ -724,12 +724,12 @@ body.logged-in #top-menu {
 #reconcile-table tr:nth-child(2n+1) td {
   background-color: var(--cmg-color-white); 
 }
-#reconcile-table.view-mode-match tr.match td,
-#reconcile-table.view-mode-both tr.match td {
+#reconcile-table.view-mode-match td.match,
+#reconcile-table.view-mode-both td.match {
   background-color: var(--cmg-color-green-003);
 }
-#reconcile-table.view-mode-diff tr.diff td,
-#reconcile-table.view-mode-both tr.diff td {
+#reconcile-table.view-mode-diff td.diff,
+#reconcile-table.view-mode-both td.diff {
   background-color: var(--cmg-color-yellow-003);
 }
 #reconcile-table tr.defined-attr th {