feat(globalDashboard): add view_all card to WorkflowPanel

packages/base/src/hooks/useThemeStyleData/__snapshots__/index.test.tsx.snap

@@ -784,6 +784,7 @@ exports[`test base/hooks/useThemeStyleData should match snapshot 3`] = `
         "archived": "#52c41a",
         "initiated_by_me": "#1677ff",
         "pending_for_me": "#fa8c16",
+        "view_all": "#722ed1",
       },
     },
   },

packages/shared/lib/api/sqle/service/GlobalDashboard/index.enum.ts

@@ -17,7 +17,9 @@ export enum GetGlobalWorkflowListV2FilterCardEnum {
 
   'pending_for_me' = 'pending_for_me',
 
-  'initiated_by_me' = 'initiated_by_me'
+  'initiated_by_me' = 'initiated_by_me',
+
+  'view_all' = 'view_all'
 }
 
 export enum GetGlobalWorkflowListV2WorkflowTypeEnum {

packages/shared/lib/api/sqle/service/common.d.ts

@@ -288,6 +288,8 @@ export interface IGlobalWorkflowStatisticsV2 {
   initiated_by_me_count?: number;
 
   pending_for_me_count?: number;
+
+  view_all_count?: number;
 }
 
 export interface IAuditResultInfo {

packages/shared/lib/testUtil/mockApi/sqle/globalDashboard/data.ts

@@ -15,7 +15,8 @@ import {
 export const mockGlobalWorkflowStatisticsData: IGlobalWorkflowStatisticsV2 = {
   pending_for_me_count: 8,
   initiated_by_me_count: 5,
-  archived_count: 12
+  archived_count: 12,
+  view_all_count: 25
 };
 
 export const mockGlobalWorkflowListData: IGlobalWorkflowListData = {

packages/sqle/src/locale/en-US/globalDashboard.ts

@@ -24,7 +24,9 @@ export default {
       initiated: 'Initiated By Me',
       initiatedSubtitle: 'Track progress',
       archived: 'Archived',
-      archivedSubtitle: 'Completed tasks'
+      archivedSubtitle: 'Completed tasks',
+      viewAll: 'View All',
+      viewAllSubtitle: 'Visible scope'
     },
     column: {
       name: 'Workflow Name',

packages/sqle/src/locale/zh-CN/globalDashboard.ts

@@ -19,7 +19,9 @@ export default {
       initiated: '我发起的',
       initiatedSubtitle: '关注进度',
       archived: '已归档',
-      archivedSubtitle: '已完结任务'
+      archivedSubtitle: '已完结任务',
+      viewAll: '查看全部',
+      viewAllSubtitle: '当前可见范围'
     },
     column: {
       name: '工单名称',

packages/sqle/src/page/GlobalDashboard/__tests__/__snapshots__/index.sqle.test.tsx.snap

@@ -343,6 +343,45 @@ exports[`GlobalDashboard should render workflow tab by default 1`] = `
               已完结任务
             </div>
           </div>
+          <div
+            class="css-yrdq2f"
+          >
+            <div
+              class="stat-card-title"
+            >
+              查看全部
+            </div>
+            <div
+              class="stat-card-count-row"
+            >
+              <span
+                class="stat-card-icon"
+              >
+                <svg
+                  color="currentColor"
+                  height="20"
+                  viewBox="0 0 16 16"
+                  width="20"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M4.667 4.667V2a.667.667 0 0 1 .666-.667H14a.667.667 0 0 1 .667.667v8.667a.667.667 0 0 1-.667.667h-2.667v2.662c0 .37-.3.67-.671.67H2.005a.67.67 0 0 1-.672-.67l.002-8.658c0-.37.3-.671.672-.671zm1.333 0h4.662c.37 0 .671.3.671.671V10h2V2.667H6z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </span>
+              <span
+                class="stat-card-count"
+              >
+                25
+              </span>
+            </div>
+            <div
+              class="stat-card-subtitle"
+            >
+              当前可见范围
+            </div>
+          </div>
         </div>
         <div
           class="ant-spin-nested-loading"

packages/sqle/src/page/GlobalDashboard/components/WorkflowPanel/__tests__/__snapshots__/index.test.tsx.snap

@@ -123,6 +123,45 @@ exports[`GlobalDashboard/WorkflowPanel should render workflow panel and request
           已完结任务
         </div>
       </div>
+      <div
+        class="css-yrdq2f"
+      >
+        <div
+          class="stat-card-title"
+        >
+          查看全部
+        </div>
+        <div
+          class="stat-card-count-row"
+        >
+          <span
+            class="stat-card-icon"
+          >
+            <svg
+              color="currentColor"
+              height="20"
+              viewBox="0 0 16 16"
+              width="20"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M4.667 4.667V2a.667.667 0 0 1 .666-.667H14a.667.667 0 0 1 .667.667v8.667a.667.667 0 0 1-.667.667h-2.667v2.662c0 .37-.3.67-.671.67H2.005a.67.67 0 0 1-.672-.67l.002-8.658c0-.37.3-.671.672-.671zm1.333 0h4.662c.37 0 .671.3.671.671V10h2V2.667H6z"
+                fill="currentColor"
+              />
+            </svg>
+          </span>
+          <span
+            class="stat-card-count"
+          >
+            25
+          </span>
+        </div>
+        <div
+          class="stat-card-subtitle"
+        >
+          当前可见范围
+        </div>
+      </div>
     </div>
     <div
       class="ant-spin-nested-loading"

packages/sqle/src/page/GlobalDashboard/components/WorkflowPanel/__tests__/index.test.tsx

@@ -9,6 +9,7 @@ import {
   createSpySuccessResponse
 } from '@actiontech/shared/lib/testUtil/mockApi/common';
 import { GlobalWorkflowListItemWorkflowTypeEnum } from '@actiontech/shared/lib/api/sqle/service/common.enum';
+import { mockGlobalWorkflowStatisticsData } from '@actiontech/shared/lib/testUtil/mockApi/sqle/globalDashboard/data';
 
 describe('GlobalDashboard/WorkflowPanel', () => {
   const openSpy = jest.spyOn(window, 'open').mockImplementation(jest.fn());
@@ -204,4 +205,79 @@ describe('GlobalDashboard/WorkflowPanel', () => {
       })
     );
   });
+
+  describe('view_all card', () => {
+    const viewAllTestCases = [
+      {
+        name: 'should render four stat cards with the fourth being "查看全部"',
+        action: async () => {
+          superRender(<WorkflowPanel />);
+          await act(async () => jest.advanceTimersByTime(3000));
+        },
+        assertion: () => {
+          expect(screen.getByText('待我处理')).toBeInTheDocument();
+          expect(screen.getByText('我发起的')).toBeInTheDocument();
+          expect(screen.getByText('已归档')).toBeInTheDocument();
+          expect(screen.getByText('查看全部')).toBeInTheDocument();
+
+          const statCards = document.querySelectorAll('.stat-card-title');
+          expect(statCards).toHaveLength(4);
+          expect(statCards[3].textContent).toBe('查看全部');
+        }
+      },
+      {
+        name: 'should request list with filter_card=view_all when clicking "查看全部" card',
+        action: async () => {
+          superRender(<WorkflowPanel />);
+          await act(async () => jest.advanceTimersByTime(3000));
+
+          fireEvent.click(screen.getByText('查看全部'));
+          await act(async () => jest.advanceTimersByTime(0));
+        },
+        assertion: () => {
+          expect(getGlobalWorkflowListSpy).toHaveBeenLastCalledWith(
+            expect.objectContaining({
+              filter_card: 'view_all'
+            })
+          );
+        }
+      },
+      {
+        name: 'should not have "查看全部" card selected by default (pending_for_me is default)',
+        action: async () => {
+          superRender(<WorkflowPanel />);
+          await act(async () => jest.advanceTimersByTime(3000));
+        },
+        assertion: () => {
+          expect(getGlobalWorkflowListSpy).toHaveBeenCalledWith(
+            expect.objectContaining({
+              filter_card: 'pending_for_me'
+            })
+          );
+        }
+      },
+      {
+        name: 'should display view_all_count value on the "查看全部" card',
+        action: async () => {
+          superRender(<WorkflowPanel />);
+          await act(async () => jest.advanceTimersByTime(3000));
+        },
+        assertion: () => {
+          const expectedCount = String(
+            mockGlobalWorkflowStatisticsData.view_all_count
+          );
+          const statCountElements =
+            document.querySelectorAll('.stat-card-count');
+          expect(statCountElements[3].textContent).toBe(expectedCount);
+        }
+      }
+    ];
+
+    viewAllTestCases.forEach(({ name, action, assertion }) => {
+      it(name, async () => {
+        await action();
+        assertion();
+      });
+    });
+  });
 });

packages/sqle/src/page/GlobalDashboard/components/WorkflowPanel/index.tsx

@@ -8,6 +8,7 @@ import {
   useTableRequestParams
 } from '@actiontech/dms-kit';
 import {
+  CheckboxMultipleBlankFilled,
   ClockCircleOutlined,
   EditFilled,
   ProfileSquareFilled
@@ -197,6 +198,23 @@ const WorkflowPanel: React.FC<WorkflowPanelProps> = ({
         sqleTheme.globalDashboard.filterCardAccent.workflow[
           GetGlobalWorkflowListV2FilterCardEnum.archived
         ]
+    },
+    {
+      key: GetGlobalWorkflowListV2FilterCardEnum.view_all,
+      title: t('globalDashboard.workflow.card.viewAll'),
+      subtitle: t('globalDashboard.workflow.card.viewAllSubtitle'),
+      count: workflowStats.data?.data.data?.view_all_count ?? 0,
+      icon: (
+        <CheckboxMultipleBlankFilled
+          color="currentColor"
+          width={20}
+          height={20}
+        />
+      ),
+      accentColor:
+        sqleTheme.globalDashboard.filterCardAccent.workflow[
+          GetGlobalWorkflowListV2FilterCardEnum.view_all
+        ]
     }
   ];
 

packages/sqle/src/theme/globalDashboard.ts

@@ -19,7 +19,8 @@ export const globalDashboardTheme: GlobalDashboardTheme = {
     workflow: {
       [GetGlobalWorkflowListV2FilterCardEnum.pending_for_me]: '#fa8c16',
       [GetGlobalWorkflowListV2FilterCardEnum.initiated_by_me]: '#1677ff',
-      [GetGlobalWorkflowListV2FilterCardEnum.archived]: '#52c41a'
+      [GetGlobalWorkflowListV2FilterCardEnum.archived]: '#52c41a',
+      [GetGlobalWorkflowListV2FilterCardEnum.view_all]: '#722ed1'
     }
   }
 };