feat(firmware): task detail

src/pages/device/Firmware/Detail/Task/Detail/index.tsx

@@ -0,0 +1,90 @@
+import { Badge, Col, Modal, Row, Statistic } from 'antd';
+import { useEffect, useState } from 'react';
+import { service, state } from '@/pages/device/Firmware';
+import encodeQuery from '@/utils/encodeQuery';
+
+interface Props {
+  visible: boolean;
+  close: () => void;
+}
+
+type TaskState = 'waiting' | 'processing' | 'success' | 'failed';
+const map = {
+  waiting: {
+    status: 'warning',
+    text: '等待升级',
+  },
+  processing: {
+    status: 'processing',
+    text: '升级中',
+  },
+  success: {
+    status: 'success',
+    text: '完成',
+  },
+  failed: {
+    status: 'error',
+    text: '失败',
+  },
+};
+const Detail = (props: Props) => {
+  const [count, setCount] = useState<{
+    waiting: number;
+    processing: number;
+    success: number;
+    failed: number;
+  }>({
+    waiting: 0,
+    processing: 0,
+    success: 0,
+    failed: 0,
+  });
+
+  const getStateCount = (status: TaskState) =>
+    service
+      .historyCount(
+        encodeQuery({
+          terms: {
+            taskId: state.taskItem?.id,
+            state: status,
+          },
+        }),
+      )
+      .then((resp) => {
+        setCount({ ...count, [`${status}`]: resp.result });
+      });
+
+  useEffect(() => {
+    (['waiting', 'processing', 'success', 'failed'] as TaskState[]).forEach((s) => {
+      getStateCount(s);
+    });
+  }, [state.taskItem]);
+
+  return (
+    <Modal width="30vw" visible={props.visible} onCancel={() => props.close()} title="任务详情">
+      <Row gutter={16}>
+        {
+          // todo 数据展示错误
+          Object.keys(count)
+            .reduce((previousValue: any[], currentValue) => {
+              previousValue.push({
+                key: currentValue,
+                value: count[currentValue],
+                ...map[currentValue],
+              });
+              return previousValue;
+            }, [])
+            .map((item) => (
+              <Col span={6}>
+                <Statistic
+                  title={<Badge status={item.status} text={item.text} />}
+                  value={item.value}
+                />
+              </Col>
+            ))
+        }
+      </Row>
+    </Modal>
+  );
+};
+export default Detail;

src/pages/device/Firmware/Detail/Task/Release/index.tsx

@@ -5,7 +5,7 @@ import { Form, FormItem, Select } from '@formily/antd';
 import type { ISchema } from '@formily/json-schema';
 import FSelectDevices from '@/components/FSelectDevices';
 import { service, state } from '@/pages/device/Firmware';
-import { DeviceInstance } from '@/pages/device/Instance/typings';
+import type { DeviceInstance } from '@/pages/device/Instance/typings';
 
 interface Props {
   close: () => void;
@@ -27,7 +27,6 @@ const Release = (props: Props) => {
 
   const save = async () => {
     const values: { releaseType: 'all' | 'part'; part: DeviceInstance[] } = await form.submit();
-    console.log(!(values.part?.length && values.part?.length <= 0), 'lent');
     if (!(values.part?.length && values.part?.length <= 0)) {
       values.releaseType = 'all';
     }

src/pages/device/Firmware/Detail/Task/index.tsx

@@ -7,12 +7,14 @@ import {
   CloudDownloadOutlined,
   DeleteOutlined,
   EyeOutlined,
+  PieChartOutlined,
   PlusOutlined,
 } from '@ant-design/icons';
 import { useIntl, useParams } from 'umi';
 import Save from '@/pages/device/Firmware/Detail/Task/Save';
 import { observer } from '@formily/react';
 import Release from '@/pages/device/Firmware/Detail/Task/Release';
+import Detail from '@/pages/device/Firmware/Detail/Task/Detail';
 
 const Task = observer(() => {
   const intl = useIntl();
@@ -72,6 +74,17 @@ const Task = observer(() => {
             <CloudDownloadOutlined />
           </Tooltip>
         </a>,
+        <a
+          key="detail"
+          onClick={() => {
+            state.taskDetail = true;
+            state.taskItem = record;
+          }}
+        >
+          <Tooltip title="任务详情">
+            <PieChartOutlined />
+          </Tooltip>
+        </a>,
         <a key="remove">
           <Tooltip title="删除">
             <DeleteOutlined />
@@ -110,6 +123,13 @@ const Task = observer(() => {
         }}
         visible={state.release}
       />
+      <Detail
+        visible={state.taskDetail}
+        close={() => {
+          state.taskDetail = false;
+          state.taskItem = undefined;
+        }}
+      />
     </>
   );
 });

src/pages/device/Firmware/index.tsx

@@ -21,10 +21,12 @@ export const state = model<{
   task: boolean;
   release: boolean;
   taskItem?: TaskItem;
+  taskDetail: boolean;
 }>({
   visible: false,
   task: false,
   release: false,
+  taskDetail: false,
 });
 const Firmware = observer(() => {
   const actionRef = useRef<ActionType>();

src/pages/device/Firmware/service.ts

@@ -31,6 +31,12 @@ class Service extends BaseService<FirmwareItem> {
       params,
     });
 
+  historyCount = (params: Record<string, unknown>) =>
+    request(`/${SystemConst.API_BASE}/firmware/upgrade/history/_count`, {
+      method: 'GET',
+      params,
+    });
+
   queryProduct = () =>
     request(`/${SystemConst.API_BASE}/device/product/_query/no-paging?paging=false`);
 }