如何智能排序我的 table 内容并在 MySQL 查询中添加样式?

How can I smart sort my table content and add style inside MySQL query?

table orders:

+----+-------+
| id | order |
+----+-------+
|  1 |    21 |
|  2 |    23 |
|  3 |    22 |
+----+-------+

table products:

+----+--------+-----------+----------+
| id |  Name  | Category  | order_id |
+----+--------+-----------+----------+
|  1 | Chair  | Furniture |       21 |
|  2 | Cat    | Animals   |       21 |
|  3 | Dog    | Animals   |       22 |
|  4 | Table  | Furniture |       22 |
|  5 | Red    | Colors    |       23 |
|  6 | Monkey | Animals   |       23 |
|  7 | Blue   | Colors    |       22 |
|  8 | Car    | Transport |       22 |
+----+--------+-----------+----------+



$orders = $db->query('SELECT *
GROUP_CONCAT(products.Name SEPARATOR " <br> ") AS products,
   FROM orders
   LEFT JOIN products ON orders.order=products.order_id
   GROUP BY orders.id ASC 
   ORDER BY orders.id ASC
')->fetchAll(PDO::FETCH_ASSOC);

这是我的结果:

table {
    border-collapse: collapse;
}

table, th, td {
    border: 1px solid black;
    vertical-align:top
}
<table>
  <tr>
    <th>id</th>
    <th>products</th>
  </tr>
  <tr>
    <td>1</td>
    <td>Chair<br>Cat</td>
  </tr>
  <tr>
    <td>2</td>
    <td>Red<br>Monkey</td>
  </tr>
   <tr>
    <td>3</td>
    <td>Table<br>Car<br>Blue<br>Dog</td>
  </tr>
</table>

我想实现的是:我想按特定的类别顺序对产品进行排序:

Colors
Animals
Furniture
Transport

并为每个产品添加类别相关颜色。所以结果应该是这样的:

table {
    border-collapse: collapse;
}

table, th, td {
    border: 1px solid black;
    vertical-align:top
}

.circle {
      width: 8px;
      height: 8px;
      -webkit-border-radius: 25px;
      -moz-border-radius: 25px;
      border-radius: 25px;
      display:inline-block
    }
    
.animals{
    background:#b8c7ce}
.colors{
    background:#aa787b}
.furniture{
    background:rgb(229, 117, 162)}
    .transport{
    background:rgb(101, 201, 148);}
<table>
  <tr>
    <th>id</th>
    <th>products</th>
  </tr>
  <tr>
    <td>1</td>
    <td><div class="circle animals"></div>Cat(Animals)<br><div class="circle furniture"></div>Chair(Furniture)</td>
  </tr>
  <tr>
    <td>2</td>
    <td><div class="circle colors"></div>Red (Colors)<br><div class="circle animals"></div>Monkey(Animals)</td>
  </tr>
   <tr>
    <td>3</td>
    <td><div class="circle colors"></div>Blue(Colors)<br><div class="circle animals"></div>Dog(Animals)<br><div class="circle furniture"></div>Table (Furniture)<br><div class="circle transport"></div>Car(Transport)</td>
  </tr>
</table>

所以我将代码更改为:

    $orders = $db->query('SELECT *
    GROUP_CONCAT(DISTINCT CONCAT("<div class="circle,
     IF(products.Category=="Animals","animals")"
     IF(products.Category=="Furniture","furniture")"
     IF(products.Category=="Transport","transport")"
     IF(products.Category=="Colors","colors")"</div>"
   ,products,Name,"(",products.Category,")") SEPARATOR " <br> ") AS products,
     FROM orders
     LEFT JOIN products ON orders.order=products.order_id
     GROUP BY orders.id ASC 
     ORDER BY FIND_IN_SET(products.Category,"Colors,Animals,Furniture,Transport") ASC
    ')->fetchAll(PDO::FETCH_ASSOC);

但是排序工作不正常,我收到一条错误消息:

Syntax error or access violation: 1064 You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near '", IF(products.Category=="Animals","animals")"...

等于运算符有一个“=”

  $orders = $db->query('SELECT *
    GROUP_CONCAT(DISTINCT CONCAT("<div class=\'circle ",
       CASE
           WHEN products.Category = "Animals" THEN "animals"
           WHEN products.Category = "Transport" THEN "transport"
           WHEN products.Category = "Furniture" THEN "furniture"
           WHEN products.Category = "Colors" THEN "colors"
           ELSE ""
       END,"\'</div>"
     ,products,Name,"(",products.Category,")")
     ORDER BY FIND_IN_SET(products.Category,"Colors,Animals,Furniture,Transport") ASC
     SEPARATOR " <br> ") AS products,
     FROM orders
     LEFT JOIN products ON orders.order=products.order_id
     GROUP BY orders.id ASC 
    ')->fetchAll(PDO::FETCH_ASSOC);