update card icon ui (#50)

* feat: update icons in various components and improve styling for better UI consistency

frontend/src/pages/DataCleansing/cleansing.const.tsx

@@ -14,10 +14,9 @@ import {
   PlayCircleOutlined,
   CheckCircleOutlined,
   AlertOutlined,
-  DatabaseOutlined,
-  AppstoreOutlined,
   PauseCircleOutlined,
 } from "@ant-design/icons";
+import { BrushCleaning, Layout } from "lucide-react";
 
 export const templateTypesMap = {
   [TemplateType.TEXT]: {
@@ -99,8 +98,7 @@ export const mapTask = (task: CleansingTask) => {
     createdAt,
     startedAt,
     finishedAt,
-    icon: <DatabaseOutlined style={{ color: "#1677ff" }} />,
-    iconColor: "bg-blue-100",
+    icon: <BrushCleaning className="w-full h-full" />,
     status,
     duration,
     before,
@@ -128,8 +126,7 @@ export const mapTemplate = (template: CleansingTemplate) => ({
   ...template,
   createdAt: formatDateTime(template.createdAt),
   updatedAt: formatDateTime(template.updatedAt),
-  icon: <AppstoreOutlined style={{ color: "#1677ff" }} />,
-  iconColor: "bg-blue-100",
+  icon: <Layout className="w-full h-full" />,
   statistics: [{ label: "算子数量", value: template.instance?.length ?? 0 }],
   lastModified: formatDateTime(template.updatedAt),
 });

frontend/src/pages/DataManagement/dataset.const.tsx

@@ -205,14 +205,7 @@ export function mapDataset(dataset: AnyObject): Dataset {
     size: formatBytes(dataset.totalSize || 0),
     createdAt: formatDateTime(dataset.createdAt) || "--",
     updatedAt: formatDateTime(dataset?.updatedAt) || "--",
-    icon: IconComponent ? (
-      <IconComponent
-        className="w-5 h-5 text-gray-500"
-        // style={{ color: iconColor }}
-      />
-    ) : (
-      <Database />
-    ),
+    icon: IconComponent ? <IconComponent className="w-full h-full" /> : <Database />,
     status: datasetStatusMap[dataset.status],
     statistics: [
       { label: "文件数", value: dataset.fileCount || 0 },

frontend/src/pages/KnowledgeBase/knowledge-base.const.tsx

@@ -66,7 +66,7 @@ export const KBTypeMap = {
 export function mapKnowledgeBase(kb: KnowledgeBaseItem): KnowledgeBaseItem {
   return {
     ...kb,
-    icon: <BookOpenText className="text-gray-400" />,
+    icon: <BookOpenText className="w-full h-full" />,
     description: kb.description,
     statistics: [
       {
@@ -78,19 +78,19 @@ export function mapKnowledgeBase(kb: KnowledgeBaseItem): KnowledgeBaseItem {
       {
         label: "文本理解模型",
         key: "chatModel",
-        icon: <BookType className="w-4 h-4 text-green-500" />,
+        icon: <BookType className="w-4 h-4 text-blue-500" />,
         value: kb.chatModel,
       },
       {
         label: "文件数",
         key: "fileCount",
-        icon: <File className="w-4 h-4 text-yellow-500" />,
+        icon: <File className="w-4 h-4 text-blue-500" />,
         value: formatNumber(kb?.fileCount) || 0,
       },
       {
         label: "大小",
         key: "size",
-        icon: <ChartNoAxesColumn className="w-4 h-4 text-red-500" />,
+        icon: <ChartNoAxesColumn className="w-4 h-4 text-blue-500" />,
         value: formatBytes(kb?.size) || "0 MB",
       },
     ],

frontend/src/pages/OperatorMarket/Home/components/Filters.tsx

@@ -140,7 +140,7 @@ const Filters: React.FC<FiltersProps> = ({
               className="cursor-pointer hover:text-blue-500"
             ></Button>
           </Tooltip>
-          <h4>筛选器</h4>
+          <span>筛选器</span>
         </h3>
         {hasActiveFilters && (
           <span

frontend/src/pages/OperatorMarket/operator.const.tsx

@@ -1,9 +1,9 @@
-import { Boxes } from "lucide-react";
+import { Code } from "lucide-react";
 import { OperatorI } from "./operator.model";
 
 export const mapOperator = (op: OperatorI) => {
   return {
     ...op,
-    icon: <Boxes className="w-5 h-5 text-gray-500" />,
+    icon: <Code className="w-full h-full" />,
   };
 };