diff --git a/src/pages/Suite/components/AddModal.tsx b/src/pages/Suite/components/AddModal.tsx
index 23a3fcdf6c88942ff68e7672899aa86183ba0e10..988425777c3719d12ea8d9f189da7ec2732bab0e 100644
--- a/src/pages/Suite/components/AddModal.tsx
+++ b/src/pages/Suite/components/AddModal.tsx
@@ -27,18 +27,6 @@ const CustomForm = styled(Form)`
     }
 `
 
-const Casetag = styled.div`
-    background-color: rgba(0,0,0,0.05);
-    border-radius: 2px;
-    padding: 3px 6px;
-    display: inline-block;
-    cursor: pointer;
-    :hover {
-        color: rgba(24,144,255,1);
-        background-color: rgba(24,144,255,0.05);
-    }
-`
-
 const ModuleSelect: React.FC = () => {
     const { state: { modules }, refreshModules } = useCaseProvider()
 
@@ -186,7 +174,7 @@ const ReactComponent: React.ForwardRefRenderFunction<IRefs, IProps> = (props, re
         form.validateFields()
             .then(async (values: any) => {
 
-                if (runMethod !== "manual") {
+                if (runMethod === "manual") {
                     if (!isCheckedCase) {
                         setLoading(false)
                         message.error("请选择T-One用例！")
@@ -273,6 +261,7 @@ const ReactComponent: React.ForwardRefRenderFunction<IRefs, IProps> = (props, re
                     <Button disabled={loading} onClick={handleOk} type="primary">确定</Button>
                 </Space>
             }
+            onCancel={handleCancel}
         >
             <CustomForm
                 form={form}
@@ -312,7 +301,7 @@ const ReactComponent: React.ForwardRefRenderFunction<IRefs, IProps> = (props, re
                 </Form.Item>
 
                 {
-                    runMethod === "manual" ?
+                    runMethod !== "manual" ?
                         <Form.Item label="测试类型" name="test_type" >
                             <Select placeholder="请选择" options={testTypeOptions} />
                         </Form.Item> :
diff --git a/src/pages/Suite/components/Case/Edit.tsx b/src/pages/Suite/components/Case/Edit.tsx
index a1bf6aa08a819769cd1196dbb5e1bec779ab069b..015041ada6f2e0c4ff02f60d8016f61ae6dcdd0d 100644
--- a/src/pages/Suite/components/Case/Edit.tsx
+++ b/src/pages/Suite/components/Case/Edit.tsx
@@ -37,7 +37,7 @@ const EditChild: React.ForwardRefRenderFunction<{}, IProps> = (props, ref) => {
                     if (children) params.custom_fields = children
                 }
                 let base_fields: any = { tools, version }
-                if (runMethod !== "manual" && checkCase) {
+                if (runMethod === "manual" && checkCase) {
                     const { id, name } = checkCase
                     if (id && name) {
                         params = {
@@ -99,7 +99,7 @@ const EditChild: React.ForwardRefRenderFunction<{}, IProps> = (props, ref) => {
             </Form.Item>
 
             {
-                runMethod === "manual" ?
+                runMethod !== "manual" ?
                     <Form.Item label="测试类型" name="type">
                         <Select options={testTypeOptions} />
                     </Form.Item> :
diff --git a/src/pages/Task/Detail/index.tsx b/src/pages/Task/Detail/index.tsx
index 3f68cbe9a87d1b47c0ab0b30e19499f1119f9f2b..538c2cb8fb84c3e369ef5cc5114bbf52f4d99049 100644
--- a/src/pages/Task/Detail/index.tsx
+++ b/src/pages/Task/Detail/index.tsx
@@ -1,47 +1,114 @@
 import React from "react"
-import { Space, Row, Typography, Button, Breadcrumb } from "antd"
+import { Space, Row, Typography, Button, Breadcrumb, Col, Spin, Empty } from "antd"
 import { useParams, Link } from "umi"
+import { useRequest } from "ahooks"
+import { viewTask } from "../services"
+import InsertRunResult from "../components/InsertRunResult"
+import TestResultTable from "../components/TestResultTable"
+import { createEditor } from "@wangeditor/editor"
 
 const TaskDetail: React.FC = () => {
+    const { task_id } = useParams() as any
 
-    const handleInsertResult = () => {
+    const { data: source, loading, refresh } = useRequest(() => viewTask(task_id), {})
 
-    }
+    const inertResultModalRef = React.useRef(null) as any
 
+    if (loading) return <Spin />
+    if (!source) return <Spin />
+
+    const { data } = source
     return (
-        <div>
-            <Space direction="vertical" style={{ width: "100%" }} size={20}>
-                <Row>
-                    <Breadcrumb>
-                        <Breadcrumb.Item>
-                            <Typography.Link>
+        <div style={{ minHeight: "100%" }}>
+            <div style={{ background: "#fff", padding: 12, }}>
+                <Space direction="vertical" style={{ width: "100%" }} size={20}>
+                    <Row justify="space-between" align="middle">
+                        <Breadcrumb>
+                            <Breadcrumb.Item>
                                 <Link to="/task">测试任务</Link>
-                            </Typography.Link>
-                        </Breadcrumb.Item>
-                        <Breadcrumb.Item>任务详情</Breadcrumb.Item>
-                    </Breadcrumb>
-                </Row>
-
-                <Row justify="space-between" align="middle">
-                    <Typography.Title level={4}>{ }</Typography.Title>
-                    <Button type="primary" onClick={handleInsertResult}>录入结果</Button>
-                </Row>
-
-                <Row style={{ background: "#ffffff", padding: 20 }}>
-                    <Space direction="vertical">
-                        <Typography.Text strong>基本信息</Typography.Text>
-                        <Row></Row>
-                    </Space>
-                </Row>
-
-                <Row style={{ background: "#ffffff", padding: 20 }}>
-                    <Space direction="vertical">
-                        <Typography.Text strong>测试结果</Typography.Text>
-                        <Row></Row>
-                    </Space>
-                </Row>
-            </Space>
-        </div>
+                            </Breadcrumb.Item>
+                            <Breadcrumb.Item>任务详情</Breadcrumb.Item>
+                        </Breadcrumb>
+                        {
+                            data.run_method === "manual" &&
+                            (
+                                !data.run_result ?
+                                    <Button
+                                        type="primary"
+                                        onClick={() => inertResultModalRef.current?.show()}
+                                    >
+                                        录入结果
+                                    </Button> :
+                                    <Button
+                                        onClick={() => inertResultModalRef.current?.show(data)}
+                                    >
+                                        修改结果
+                                    </Button>
+                            )
+                        }
+                    </Row>
+                </Space>
+                <Space direction="vertical" style={{ width: "100%" }}>
+                    <Row>
+                        <Typography.Title level={4} style={{ margin: 0 }}>
+                            {data?.name}
+                        </Typography.Title>
+                    </Row>
+                    <Row>
+                        <Col span={8} style={{ marginBottom: 8 }}>
+                            <Space>
+                                <Typography.Text strong>测试方案：</Typography.Text>
+                                <Typography.Text>{data.plan}</Typography.Text>
+                            </Space>
+                        </Col>
+                        <Col span={8} style={{ marginBottom: 8 }}>
+                            <Space>
+                                <Typography.Text strong>运行方式：</Typography.Text>
+                                <Typography.Text>{data.run_method}</Typography.Text>
+                            </Space>
+                        </Col>
+                        <Col span={8} style={{ marginBottom: 8 }}>
+                            <Space>
+                                <Typography.Text strong>创建人：</Typography.Text>
+                                <Typography.Text>{data.owner}</Typography.Text>
+                            </Space>
+                        </Col>
+                        <Col span={8}>
+                            <Space>
+                                <Typography.Text strong>创建时间：</Typography.Text>
+                                <Typography.Text>{data.gmt_created}</Typography.Text>
+                            </Space>
+                        </Col>
+                        <Col span={8}>
+                            <Space>
+                                <Typography.Text strong>描述：</Typography.Text>
+                                <Typography.Text ellipsis>{data.desc}</Typography.Text>
+                            </Space>
+                        </Col>
+                    </Row>
+                </Space>
+            </div>
+            <div style={{ background: "#fff", padding: 12, marginTop: 12, minHeight: 500 }}>
+                {
+                    data.run_method === "manual" &&
+                    (
+                        data.run_result ?
+                            <div dangerouslySetInnerHTML={{
+                                __html: createEditor({ content: data?.custom_fields || [] }).getHtml()
+                            }} /> :
+                            <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} style={{ marginTop: 200 }} />
+                    )
+                }
+                {
+                    data.run_method !== "manual" &&
+                    <TestResultTable />
+                }
+            </div>
+            <InsertRunResult
+                ref={inertResultModalRef}
+                onOk={refresh}
+            />
+        </div >
     )
 }
 
diff --git a/src/pages/Task/components/AddTaskModal.tsx b/src/pages/Task/components/AddTaskModal.tsx
index b3e47528e34a63ec63d2190398e200b7eef37741..073b0063f7c6d6e71d0cccd2d4790277c0454f8b 100644
--- a/src/pages/Task/components/AddTaskModal.tsx
+++ b/src/pages/Task/components/AddTaskModal.tsx
@@ -1,6 +1,16 @@
 import React from "react"
-import { Modal, Form, Input, Space, Button, Select, Radio } from "antd"
+import { Modal, Form, Input, Space, Button, Select, Radio, message } from "antd"
+import { useRequest } from "ahooks";
+import { request } from "umi";
+import { runMethodOptions } from "@/pages/Suite/utils"
+import styled from "styled-components"
+import { createTask } from "../services";
 
+const CustomForm = styled(Form)`
+    .ant-form-item {
+        margin-bottom: 12px;
+    }
+`
 type IProps = {
     onOk: () => void;
     onCancel?: () => void;
@@ -16,6 +26,22 @@ const ReactComponent: React.ForwardRefRenderFunction<IRefs, IProps> = (props, re
     const [visible, setVisible] = React.useState<boolean>(false)
     const [loading, setLoading] = React.useState<boolean>(false)
     const [source, setSource] = React.useState<undefined | any>(undefined)
+    const [runMethod, setRunMethod] = React.useState<any>("manual")
+
+    const { data: plans } = useRequest(() => request(`/api/plan`), {})
+    const { data: cases } = useRequest(() => request(`/api/case/`), {})
+
+    const plansOptions = React.useMemo(() => {
+        if (plans && plans.data.length > 0)
+            return plans.data.map((i: any) => ({ label: i.name, value: i.id }))
+        return []
+    }, [plans])
+
+    const casesOptions = React.useMemo(() => {
+        if (cases && cases.data.length > 0)
+            return cases.data.map((i: any) => ({ label: i.name, value: i.id }))
+        return []
+    }, [cases])
 
     React.useImperativeHandle(ref, () => ({
         show(_: any) {
@@ -31,52 +57,76 @@ const ReactComponent: React.ForwardRefRenderFunction<IRefs, IProps> = (props, re
         setVisible(false)
         setLoading(false)
         setSource(undefined)
+        setRunMethod("manual")
+        form.resetFields()
     }
 
     const handleOk = async () => {
         if (loading) return
         setLoading(true)
-        onOk()
-        handleCancel()
+
+        form.validateFields()
+            .then(async (values) => {
+                const { code, msg } = await createTask(values)
+                if (code !== 200) {
+                    setLoading(false)
+                    message.error(msg)
+                    return
+                }
+
+                onOk()
+                handleCancel()
+            }).catch((err) => {
+                setLoading(false)
+            })
     }
 
     return (
         <Modal
             visible={visible}
-            title={source ? "编辑任务" : "新建任务"}
+            title={source ? "编辑测试任务" : "新建测试任务"}
             width={"36%"}
             footer={
                 <Space align="end">
                     <Button onClick={handleCancel}>取消</Button>
-                    <Button disabled={loading} onClick={handleOk}>确定</Button>
+                    <Button disabled={loading} onClick={handleOk} type="primary">确定</Button>
                 </Space>
             }
             onCancel={handleCancel}
-            onOk={handleOk}
         >
-            <Form
+            <CustomForm
                 form={form}
                 labelCol={{ span: 4 }}
+                initialValues={{
+                    run_method: "manual"
+                }}
             >
                 <Form.Item name="name" label="名称" rules={[{ required: true }]}>
-                    <Input placeholder="请输入任务名称" autoComplete="off" />
+                    <Input placeholder="请输入测试任务名称" autoComplete="off" />
                 </Form.Item>
-                <Form.Item name="name" label="测试方案" rules={[{ required: true }]}>
-                    <Select options={[]} placeholder="请选择测试方案" />
+                <Form.Item name="plan_id" label="测试方案" rules={[{ required: true }]}>
+                    <Select options={plansOptions} placeholder="请选择测试方案" />
                 </Form.Item>
-                <Form.Item name="name" label="测试用例" rules={[{ required: true }]}>
-                    <Select options={[]} placeholder="请选择测试用例" />
+                <Form.Item name="cases" label="测试用例" rules={[{ required: true }]}>
+                    <Select options={casesOptions} mode="multiple" placeholder="请选择测试用例" />
                 </Form.Item>
-                <Form.Item name="name" label="运行方式" rules={[{}]}>
-                    <Radio.Group>
-                        <Radio>自动</Radio>
-                        <Radio>手动</Radio>
-                    </Radio.Group>
+                <Form.Item name="run_method" label="运行方式" rules={[{ required: true }]}>
+                    <Radio.Group options={runMethodOptions} onChange={({ target }) => setRunMethod(target.value)} />
+                </Form.Item>
+
+                <Form.Item name="device_id" label="测试设备" rules={[{ required: true }]}>
+                    <Select options={casesOptions} placeholder="请选择测试设备" />
                 </Form.Item>
-                <Form.Item name="name" label="备注" rules={[{}]}>
+                {
+                    runMethod !== "manual" &&
+                    <Form.Item name="device_ip" label="测试配置" >
+                        <Input.TextArea placeholder="请输入" />
+                    </Form.Item>
+                }
+                <Form.Item name="desc" label="备注" rules={[{}]}>
                     <Input.TextArea placeholder="请输入备注" autoComplete="off" />
                 </Form.Item>
-            </Form>
+            </CustomForm>
         </Modal>
     )
 }
diff --git a/src/pages/Task/components/ExpandedCaseTable.tsx b/src/pages/Task/components/ExpandedCaseTable.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..f37c853d38a4d1a518e930b7d3cc5d853863a47f
--- /dev/null
+++ b/src/pages/Task/components/ExpandedCaseTable.tsx
@@ -0,0 +1,55 @@
+import React from "react"
+import { Table, Space, Typography, Row, Button, Divider } from "antd"
+import styled from "styled-components"
+type IProps = {
+    [k: string]: any
+}
+
+const CustomTable = styled(Table)`
+    .ant-table-tbody .ant-table-row.ant-table-row-level-0:last-child {
+        td {
+            border-bottom: none;
+        }
+    }
+`
+
+const ExpandedCaseTable: React.FC<IProps> = ({ dataSource = [], id }) => {
+    const columns = [{
+        dataIndex: "title",
+        width: "43%",
+        render() {
+            return "commands"
+        }
+    },
+    {
+        dataIndex: "cv_value",
+        render() {
+            return "3598364.00±1.57%"
+        }
+    }]
+
+    return (
+        <Row style={{ width: "100%", background: "#fff" }}>
+            <Space direction="vertical" size={0} style={{ marginLeft: 25 }}>
+                {
+                    dataSource.map((i: any, idx: number) => (
+                        <div key={i.id} style={{ padding: "8px 0", borderLeft: "1px solid #eee", display: "flex", alignItems: "center", width: 30, height: 39 }}>
+                            <Divider style={{ margin: 0 }} />
+                        </div>
+                    ))
+                }
+            </Space>
+            <CustomTable
+                style={{ width: "calc(100% - 55px)" }}
+                columns={columns}
+                showHeader={false}
+                dataSource={dataSource || []}
+                rowKey={"id"}
+                size="small"
+                pagination={false}
+            />
+        </Row>
+    )
+}
+
+export default ExpandedCaseTable
\ No newline at end of file
diff --git a/src/pages/Task/components/InsertRunResult.tsx b/src/pages/Task/components/InsertRunResult.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..e27e58c0bea6c426b2240bf1a3b9c15bee64737b
--- /dev/null
+++ b/src/pages/Task/components/InsertRunResult.tsx
@@ -0,0 +1,84 @@
+import React from "react"
+import { Modal, Form, Input, Space, Button, Row, Col, Radio } from "antd"
+import RichTextEditor from '@/components/RichTextEditor'
+
+type IProps = {
+    onOk: () => void;
+    onCancel?: () => void;
+}
+
+type IRefs = {
+    [k: string]: any
+}
+
+const ReactComponent: React.ForwardRefRenderFunction<IRefs, IProps> = (props, ref) => {
+    const { onOk } = props
+
+    const [visible, setVisible] = React.useState<boolean>(false)
+    const [loading, setLoading] = React.useState<boolean>(false)
+    const [source, setSource] = React.useState<undefined | any>(undefined)
+
+    React.useImperativeHandle(ref, () => ({
+        show(_: any) {
+            setSource(_)
+            setVisible(true)
+            form.setFieldsValue(_)
+        }
+    }))
+
+    const [form] = Form.useForm()
+
+    const handleCancel = () => {
+        setVisible(false)
+        setLoading(false)
+        setSource(undefined)
+        form.resetFields()
+    }
+
+    const handleOk = async () => {
+        if (loading) return
+        setLoading(true)
+        onOk()
+        handleCancel()
+    }
+
+    return (
+        <Modal
+            visible={visible}
+            title={source ? "修改结果" : "录入结果"}
+            bodyStyle={{ padding: 0 }}
+            width={"75%"}
+            footer={
+                <Space align="end">
+                    <Button onClick={handleCancel}>取消</Button>
+                    <Button disabled={loading} onClick={handleOk}>确定</Button>
+                </Space>
+            }
+            onCancel={handleCancel}
+        >
+            <Row>
+                <Col span={18} style={{ padding: 20, borderRight: "1px solid #f0f0f0" }}>
+                    <Space style={{ width: "100%" }} direction="vertical" size={20}>
+                        <div style={{
+                            backgroundColor: "#FFFFFF",
+                            border: "1px solid #d9d9d9",
+                            borderRadius: 2,
+                            height: 472
+                        }}>
+                            <RichTextEditor />
+                        </div>
+                    </Space>
+                </Col>
+                <Col span={6} style={{ padding: 20 }}>
+                    <Form form={form} layout="vertical">
+                        <Form.Item label="测试结果" name="state">
+                            <Radio.Group options={[{ label: "成功", value: "success" }, { label: "失败", value: "fail" }]} />
+                        </Form.Item>
+                    </Form>
+                </Col>
+            </Row>
+        </Modal>
+    )
+}
+
+export default React.forwardRef(ReactComponent)
\ No newline at end of file
diff --git a/src/pages/Task/components/TestResultTable.tsx b/src/pages/Task/components/TestResultTable.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..c2b10a8d1e7125a51262375283c0abfd8fa3e6a5
--- /dev/null
+++ b/src/pages/Task/components/TestResultTable.tsx
@@ -0,0 +1,141 @@
+import React from "react"
+import { Table, Space, Typography, Row, TableColumnProps, Tooltip } from "antd"
+import moment from "moment"
+import ExpandedCaseTable from "./ExpandedCaseTable"
+import styled from "styled-components"
+
+const BasicTable = styled(Table)`
+    .ant-table-small .ant-table-thead > tr > th {
+        background-color: transparent;
+    }
+    .ant-table-thead > tr > th:not(:last-child):not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan])::before {
+        background-color: transparent;
+    }
+    .ant-table-expanded-row.ant-table-expanded-row-level-1 > td {
+        padding: 0!important;
+    }
+`
+
+const stateColorMap = (state: string) => new Map([
+    ["count", "rgba(24,144,255,1)"],
+    ["pass", "rgba(9,162,74,1)"],
+    ["up", "rgba(9,162,74,1)"],
+    ["down", "rgba(232,63,7,1)"],
+    ["fail", "rgba(232,63,7,1)"],
+]).get(state) || "rgba(0,0,0,0.65)"
+
+const stateWordMap = (state: string) => new Map([
+    ["count", "总计"],
+    ["pass", "通过"],
+    ["up", "上升"],
+    ["down", "下降"],
+    ["fail", "失败"],
+    ["pass", "跳过"],
+    ["no", "无效"],
+    ["normal", "正常"],
+    ["na", "N/A"],
+]).get(state)
+
+const len = new Array(8).fill("");
+const dataSource = len.map((i: any, idx: number) => ({
+    id: idx,
+    tone_case: `perf-test: default-${idx}`,
+    test_case: len.map((i: any, idx: number) => ({
+        id: idx,
+        title: "pkg/sentry/fsimpl/ext[ext_test]",
+        cv_value: "3598364.00±1.57%"
+    }))
+}))
+
+const TableList: React.FC = () => {
+    const [expanedKeys, setExpandedKeys] = React.useState([])
+
+    const columns: TableColumnProps<any>[] = [{
+        title: "用例",
+        dataIndex: "tone_case",
+        width: 300,
+    },
+    {
+        width: 130,
+        title: "测试设备",
+        render(_) {
+            return "机器名称"
+        }
+    },
+    {
+        title: "测试类型",
+        width: 130,
+        render(_) {
+            return "功能测试"
+        }
+    },
+    {
+        title: "结果",
+        render(_) {
+            return (
+                <Tooltip
+                    overlayStyle={{ maxWidth: "unset" }}
+                    overlayInnerStyle={{ color: "#000" }}
+                    color={"#fff"}
+                    title={
+                        <Space>
+                            <Typography.Text style={{ color: stateColorMap("count") }}>总计</Typography.Text>/
+                            <Typography.Text style={{ color: stateColorMap("up") }}>上升</Typography.Text>/
+                            <Typography.Text style={{ color: stateColorMap("down") }}>下降</Typography.Text>/
+                            <Typography.Text style={{ color: stateColorMap("") }}>正常</Typography.Text>/
+                            <Typography.Text style={{ color: stateColorMap("") }}>无效</Typography.Text>/
+                            <Typography.Text style={{ color: stateColorMap("") }}>N/A</Typography.Text>
+                        </Space>
+                    }
+                >
+                    <Space>
+                        <Typography.Text style={{ color: stateColorMap("count") }}>9</Typography.Text>/
+                        <Typography.Text style={{ color: stateColorMap("up") }}>0</Typography.Text>/
+                        <Typography.Text style={{ color: stateColorMap("down") }}>0</Typography.Text>/
+                        <Typography.Text style={{ color: stateColorMap("") }}>0</Typography.Text>/
+                        <Typography.Text style={{ color: stateColorMap("") }}>0</Typography.Text>/
+                        <Typography.Text style={{ color: stateColorMap("") }}>0</Typography.Text>
+                    </Space>
+                </Tooltip>
+            )
+        }
+    },
+    {
+        title: "开始时间",
+        width: 170,
+        dataIndex: "start_time",
+        render() {
+            return moment().format("YYYY-MM-DD hh:mm:ss")
+        }
+    },
+    {
+        title: "持续时间",
+        width: 130,
+        dataIndex: "use_time",
+        render() {
+            return "3h 40m 22s"
+        }
+    }]
+
+    return (
+        <Space direction="vertical" style={{ width: "100%" }}>
+            <Row justify="space-between" align="middle">
+                <Typography.Text strong style={{ margin: 0 }}>测试结果</Typography.Text>
+            </Row>
+            <BasicTable
+                columns={columns}
+                dataSource={dataSource || []}
+                size="small"
+                rowKey={"id"}
+                expandable={{
+                    expandedRowRender: (record: any) => {
+                        return <ExpandedCaseTable {...record} dataSource={record?.test_case} />
+                    },
+                }}
+                pagination={false}
+            />
+        </Space>
+    )
+}
+
+export default TableList
\ No newline at end of file
diff --git a/src/pages/Task/index.tsx b/src/pages/Task/index.tsx
index 70d7841564341eb4d42c716aee75cdeec3047dc6..adb01abaa5b77a266576b506372683fe72255b71 100644
--- a/src/pages/Task/index.tsx
+++ b/src/pages/Task/index.tsx
@@ -1,8 +1,9 @@
 import React from "react"
-import { Table, Space, Typography, Row, Button } from "antd"
-import { queryTableList } from "./services"
+import { Table, Space, Typography, Row, Button, message } from "antd"
+import { queryTaskList, deleteTask } from "./services"
 import { useRequest } from "ahooks"
 import AddModal from "./components/AddTaskModal"
+import { history } from "umi"
 
 const DEFAULT_PAGE_QUERY = { page_size: 20, page_num: 1 }
 
@@ -10,7 +11,7 @@ const TableList: React.FC = () => {
     const [pageQuery, setPageQuery] = React.useState(DEFAULT_PAGE_QUERY)
 
     const { data: dataSource, loading, refresh } = useRequest(
-        (params = pageQuery) => queryTableList(params),
+        (params = pageQuery) => queryTaskList(params),
         { refreshDeps: [pageQuery] }
     )
 
@@ -25,35 +26,40 @@ const TableList: React.FC = () => {
     }
 
     const handleDelete = async (row: any) => {
-
+        const { msg, code } = await deleteTask(row.id)
+        if (code !== 200) return message.error(msg)
+        refresh()
     }
 
     const columns = [{
         title: "名称",
-        dataIndex: "",
+        dataIndex: "name",
     }, {
         title: "状态",
-        dataIndex: "",
+        dataIndex: "status",
     }, {
         title: "运行方式",
-        dataIndex: "",
+        dataIndex: "run_method",
     }, {
         title: "测试方案",
-        dataIndex: "",
+        dataIndex: "plan_id",
     }, {
         title: "备注",
-        dataIndex: "",
+        dataIndex: "desc",
     }, {
         title: "创建人",
-        dataIndex: "",
+        dataIndex: "owner",
     }, {
         title: "创建日期",
-        dataIndex: "",
+        dataIndex: "gmt_created",
     }, {
         title: "操作",
         render(row: any) {
             return (
                 <Space>
+                    <span onClick={() => history.push(`/task/${row.id}`)}>
+                        <Typography.Link>查看</Typography.Link>
+                    </span>
                     <span onClick={() => handleEdit(row)}>
                         <Typography.Link>编辑</Typography.Link>
                     </span>
@@ -66,7 +72,7 @@ const TableList: React.FC = () => {
     }]
 
     return (
-        <Space direction="vertical" style={{ width: "100%" }}>
+        <Space direction="vertical" style={{ width: "100%", background: "#fff", padding: 12 }}>
             <Row justify="space-between" align="middle">
                 <Typography.Title level={4} style={{ margin: 0 }}>测试任务</Typography.Title>
                 <Button type="primary" onClick={handleAdd}>新建</Button>
diff --git a/src/pages/Task/services.ts b/src/pages/Task/services.ts
index d73761c0a6948186006c2493b4cc75090e089634..b9e14527507f05b25330cbb608f268d8136657f1 100644
--- a/src/pages/Task/services.ts
+++ b/src/pages/Task/services.ts
@@ -1,5 +1,29 @@
 import { request } from "umi"
 
-export const queryTableList = async (data: any) => {
-    return request(`/api/xxx`)
+export const queryTaskList = async (params: any) => {
+    return request(`/api/task`, { params })
+}
+
+export const createTask = async (data: any) => {
+    return request(`/api/task/create`, { data, method: "post" })
+}
+
+export const deleteTask = async (task_id: any) => {
+    return request(`/api/task/${task_id}`, { method: "DELETE" })
+}
+
+export const updateTask = async (task_id: any, params: any) => {
+    return request(`/api/task/${task_id}`, { params, method: "put" })
+}
+
+export const viewTask = async (task_id: any) => {
+    return request(`/api/task/${task_id}`)
+}
+
+export const viewTaskCase = async (task_id: any, params: any) => {
+    return request(`/api/task/${task_id}/case`, { params })
+}
+
+export const addTaskCase = async (task_id: any, params: any) => {
+    return request(`/api/task/${task_id}/case`, { params })
 }
\ No newline at end of file