Enhance product display with custom names and improved styling; update table headers

.vscode/ftp-kr.sync.cache.json

@@ -82,7 +82,7 @@
       "config.php": {
         "type": "-",
         "size": 347,
-        "lmtime": 1733859622965,
+        "lmtime": 1734205448994,
         "modified": false
       },
       "cron.php": {

autoload/controls/class.Products.php

@@ -26,11 +26,26 @@ class Products
 
     foreach ( $db_results as $row )
     {
+      $custom_class = '';
       $custom_label_4 = \factory\Products::get_product_data( $row['product_id'], 'custom_label_4' );
+      $custom_name = \factory\Products::get_product_data( $row['product_id'], 'title' );
+
+      if ( $custom_name )
+      {
+        $row['name'] = $custom_name;
+        $custom_class = 'custom_name';
+      }
 
       $data['data'][] = [
         $row['product_id'],
-        $row['name'],
+        '<div class="table-product-title">
+          <a href="/products/product_history/client_id=' . $client_id . '&product_id=' . $row['product_id'] . '" target="_blank" class="' . $custom_class . '">
+            ' . $row['name'] . '
+          </a>
+          <span class="edit-product-title" offer-id="' . $row['product_id'] . '">
+            <i class="fa fa-pencil"></i>
+          </span>
+        </div>',
         $row['impressions'],
         $row['impressions_30'],
         $row['clicks'],

layout/style.scss

@@ -1,6 +1,7 @@
 $cBlue: #6690F4;
 $cRed: #aa0505;
 $cGreen: #43833f;
+$cGreenLight: #57b951;
 $cBlack: #4e5e6a;
 
 .animate {
@@ -1236,4 +1237,36 @@ body>.top {
       background: #eee;
     }
   }
+}
+
+table {
+  &#products {
+    .table-product-title {
+      display: flex;
+      justify-content: space-between;
+    }
+
+    .edit-product-title {
+      display: flex;
+      height: 25px;
+      align-items: center;
+      justify-content: center;
+      width: 25px;
+      cursor: pointer;
+      background: #fff;
+      border: 1px solid #9b9b9b;
+      color: #9b9b9b;
+
+      &:hover {
+        background: #9b9b9b;
+        color: #fff;
+      }
+    }
+
+    a {
+      &.custom_name {
+        color: $cGreenLight !important;
+      }
+    }
+  }
 }

templates/products/main_view.php

@@ -25,7 +25,7 @@
         <thead>
           <tr>
             <th scope="col">Id</th>
-            <th scope="col">Tytuł</th>
+            <th scope="col">Nazwa produktu</th>
             <th scope="col">Wyśw.</th>
             <th scope="col">Wyśw. (30 dni)</th>
             <th scope="col">Klik.</th>
@@ -66,18 +66,7 @@
         serverSide: true,
         columns: [
           { width: '100px', orderable: false },
-          { width: 'auto', name: 'title', render: function( data, type, row ) {
-            return `
-              <div class="table-product-title">
-                <a href="/products/product_history/client_id=${client_id}&product_id=${row[0]}" target="_blank">
-                  ${data}
-                </a>
-                <span class="edit-product-title" offer-id="${row[0]}">
-                  <i class="fa fa-pencil-square"></i>
-                </span>
-              </div>
-            `;
-          }},
+          { width: 'auto', name: 'name' },
           { width: 'auto', name: 'impressions' },
           { width: 'auto', name: 'impressions_30' },
           { width: 'auto', name: 'clicks' },