shadcn 表格有间距，然后给某一行加边框显示不出来，用div覆盖

方案一：此方法ios上有局限性，可能会包裹整个Table 而不是当前的TableRow
`pointer-events-none` 到边框 `div` 上，以确保它不会干扰用户与表格的交互。

 

 

{isToday && (

<div className="absolute inset-0 border-2 border-yellow-400 pointer-events-none" />

)}

方案二：我们可以使用嵌套的 div 来包裹每一行，并在这个 div 上应用间距

<div className="space-y-2">
      {listData.map((item, index: number) => {
        const isToday = item.status === LOSS_BONUS_STATUS_ENUM.CALCULATING;
        const amoutColorCls = getAmoutOfLossCololCls(item);
        return (
          <div key={item.day + index} className={`${isToday && "border border-primary"} rounded-sm overflow-hidden`}>
            <Table className="w-full">
              <TableBody>
                <TableRow
                  className={`text-xs text-left text-white font-ali`}
                >
                  <TableCell className={`w-1/6 py-2`}>
                    <span>{t("DAY")}</span>
                    <span className="ml-0.5">{index + 1}</span>
                  </TableCell>

                  <TableCell className={`w-1/4 py-2`}>
                    {item.date}
                  </TableCell>

                  <TableCell className={`text-xs ${amoutColorCls} py-2`}>
                    <span className="mr-0.5">{amoutOfLossSymbol(item)}</span>
                    <span>{amoutOfLossMoneySymbol(item)} {amoutOfLossVal(item)}</span>
                  </TableCell>
                  
                  <TableCell className={`text-lightgray py-2`}>
                    <span className={getLossBonusCololCls(item)}>
                      {getLossBonusValSymbol(item) + getLossBonusVal(item)}
                    </span>
                  </TableCell>
                </TableRow>
              </TableBody>
            </Table>
          </div>
        );
      })}
    </div>