diff --git a/src/src/main/java/com/my/graphiteDigesterBg/diframe/DiTestcaseManager.java b/src/src/main/java/com/my/graphiteDigesterBg/diframe/DiTestcaseManager.java
index 2baffe8..64ec644 100644
--- a/src/src/main/java/com/my/graphiteDigesterBg/diframe/DiTestcaseManager.java
+++ b/src/src/main/java/com/my/graphiteDigesterBg/diframe/DiTestcaseManager.java
@@ -5,6 +5,7 @@ import org.slf4j.LoggerFactory;
 
 import java.lang.reflect.Constructor;
 import java.lang.reflect.InvocationTargetException;
+import java.util.ArrayList;
 import java.util.HashMap;
 import java.util.List;
 import java.util.Map;
@@ -14,12 +15,25 @@ public class DiTestcaseManager {
     // device
     private final DiDevice device;
     // testcase classes
-    private final Map<String, DiTestcaseInfo> testcasees;
+    private final Map<String, DiTestcaseInfo> testcases;
 
     // constructor
     public DiTestcaseManager(DiDevice device) {
         this.device = device;
-        this.testcasees = new HashMap<>();
+        this.testcases = new HashMap<>();
+    }
+
+    // list
+    public List<Map<String, Object>> list() {
+        var list = new ArrayList<Map<String, Object>>();
+        for ( var entry : this.testcases.entrySet() ) {
+            var info = new HashMap<String, Object>();
+            info.put("name", entry.getKey());
+            info.put("title", entry.getValue().title);
+            info.put("description", entry.getValue().description);
+            list.add(info);
+        }
+        return list;
     }
 
     // setup
@@ -37,7 +51,7 @@ public class DiTestcaseManager {
                         info.title = testcaseAnnotation.title();
                         info.description = testcaseAnnotation.description();
                         info.clazz = testClass;
-                        this.testcasees.put(testcaseAnnotation.name(), info);
+                        this.testcases.put(testcaseAnnotation.name(), info);
                         LOG.info("(Testcase) {} => {}", testcaseAnnotation.name(), testClass.getName());
                     }
                 }
@@ -47,7 +61,7 @@ public class DiTestcaseManager {
 
     // execute testcase by name
     public void execute( String name ) {
-        var info = this.testcasees.get(name);
+        var info = this.testcases.get(name);
         if ( info == null ) {
             throw new RuntimeException("Testcase not found: " + name);
         }
diff --git a/src/web/src/pages/main/Page.vue b/src/web/src/pages/main/Page.vue
index c478e7a..bb0328e 100644
--- a/src/web/src/pages/main/Page.vue
+++ b/src/web/src/pages/main/Page.vue
@@ -32,6 +32,7 @@
         <content-task-step-management v-else-if="'preset' === activeContent"/>
         <content-acid-management v-else-if="'acid' === activeContent"/>
         <content-test v-else-if="'test' === activeContent"/>
+        <content-task v-else-if="'task' === activeContent"/>
       </a-layout-content>
       <a-layout-sider class="!bg-transparent p-1" width="200">
         <div class="h-full flex flex-col justify-between">
@@ -68,9 +69,9 @@ import ContentHistory from './contents/History.vue'
 import ContentTaskStepManagement from './contents/TaskStepManagement.vue'
 import ContentAcidManagement from './contents/AcidManagement.vue'
 import ContentTest from './contents/Test.vue'
+import ContentTask from './contents/Task.vue'
 import ApiClient from '@/utils/ApiClient';
 import Loading from '@/components/Loading.vue'
-import Common from '@/utils/Common.js'
 /** @var {AppStore} */
 const appStore = useAppStore();
 /** @var {Ref<string>} */
@@ -83,6 +84,7 @@ const contents = [
     {key:'acid', title: '酸液管理',icon:'experiment'},
     {key:'user', title: '用户管理',icon:'user'},
     {key:'test', title: '功能测试',icon:'issues-close'},
+    {key:'task', title: '任务状态',icon:'code'},
 ];
 /** @var {Loading} */
 const loadingModal = ref(null);
diff --git a/src/web/src/pages/main/contents/Task.vue b/src/web/src/pages/main/contents/Task.vue
new file mode 100644
index 0000000..7c62615
--- /dev/null
+++ b/src/web/src/pages/main/contents/Task.vue
@@ -0,0 +1,78 @@
+<template>
+  <div class="p-1">
+    <a-table 
+      :pagination="pagination"
+      :dataSource="dataSource" 
+      :columns="columns"
+      @change="actionTableChange"
+    >
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.key === 'user'">
+          {{ record.user.account }}
+        </template>
+       <template v-else-if="column.key === 'createdAt'">
+          {{ formatTime(record.createdAt) }}
+        </template>
+      </template>
+    </a-table>
+  </div>
+</template>
+<script setup>
+import ApiClient from '@/utils/ApiClient';
+import { onMounted, ref } from 'vue';
+/** @var {Array<Object>} */
+const columns = [
+    {key:'user',dataIndex:'user',title:'用户',align:'left'},
+    {key:'status',dataIndex:'status',title:'状态',align:'left'},
+    {key:'name',dataIndex:'name',title:'名称',align:'left'},
+    {key:'runtimeStatus',dataIndex:'runtimeStatus',title:'运行时状态',align:'left'},
+    {key:'message',dataIndex:'message',title:'消息',align:'left'},
+    {key:'createdAt',dataIndex: 'createdAt',title:'创建时间',align:'right'},
+];
+/** @var {Array<Object>} */
+const dataSource = ref([]);
+/** @var {Object} */
+const pagination = ref({
+    current: 1,
+    pageSize: 10,
+    total: 0,
+    showSizeChanger: false,
+});
+// on mounted
+onMounted(mounted);
+
+// on mounted
+async function mounted() {
+    await refresh();
+}
+
+// format time
+function formatTime(time) {
+    let date = new Date(time * 1000);
+    let year = date.getFullYear();
+    let month = (date.getMonth()+1).toString().padStart(2,'0');
+    let day = (date.getDate()).toString().padStart(2,'0');
+    let hour = (date.getHours()).toString().padStart(2,'0');
+    let minute = (date.getMinutes()).toString().padStart(2,'0');
+    let second = (date.getSeconds()).toString().padStart(2,'0');
+    return `${year}-${month}-${day} ${hour}:${minute}:${second}`;
+}
+
+// refresh
+async function refresh() {
+    let client = ApiClient.getClient();
+    let response = await client.call("task/list", {
+        offset : (pagination.value.current-1)*pagination.value.pageSize,
+        limit : pagination.value.pageSize,
+    });
+    dataSource.value = response.list;
+    pagination.value.total = response.total;
+}
+
+//  action table change
+async function actionTableChange(page) {
+    pagination.value.current = page.current;
+    pagination.value.pageSize = page.pageSize;
+    await refresh();
+}
+</script>
\ No newline at end of file
diff --git a/src/web/src/pages/main/contents/Test.vue b/src/web/src/pages/main/contents/Test.vue
index 56612c3..9d6eb51 100644
--- a/src/web/src/pages/main/contents/Test.vue
+++ b/src/web/src/pages/main/contents/Test.vue
@@ -1,33 +1,87 @@
 <template>
     <div class="p-1">
-      <a-table :dataSource="dataSource" :columns="columns"></a-table>
+      <a-table :dataSource="funcDataSource" :columns="funcColumns">
+        <template #bodyCell="{ column, record }">
+          <template v-if="column.key === 'action'">
+            <a-popconfirm title="确定要运行吗？" ok-text="确定" cancel-text="取消" placement="left" @confirm="actionFunctionalTestExec(record)">
+              <a-button size="small">运行</a-button>
+            </a-popconfirm>
+          </template>
+        </template>
+      </a-table>
+      
+      <!-- <a-tabs v-model:activeKey="activeKey" class="bg-white rounded-xl" type="card">
+        <a-tab-pane key="functional" tab="功能测试">
+          <a-table :dataSource="funcDataSource" :columns="funcColumns">
+            <template #bodyCell="{ column, record }">
+              <template v-if="column.key === 'action'">
+                <a-popconfirm title="确定要运行吗？" ok-text="确定" cancel-text="取消" placement="left" @confirm="actionFunctionalTestExec(record)">
+                  <a-button size="small">运行</a-button>
+                </a-popconfirm>
+              </template>
+            </template>
+          </a-table>
+        </a-tab-pane>
+        <a-tab-pane key="unit" tab="单元测试" force-render>
+          <a-table :columns="actColumns" :dataSource="actDataSource">
+            <template #bodyCell="{ column, record }">
+              <template v-if="column.key === 'action'">
+                <text-actuator-execute :type="record.type"/>
+              </template>
+            </template>
+          </a-table>
+        </a-tab-pane>
+      </a-tabs> -->
     </div>
   </template>
 <script setup>
-import { ref } from 'vue';
+import ApiClient from '@/utils/ApiClient';
+import TestAcutatorExecute from './TestActuatorExecute.vue';
+import { onMounted, ref } from 'vue';
 /** @var {Array<Object>} */
-const columns = [
+const funcColumns = [
+    {key:'title',dataIndex:'title',title:'标题',align:'left'},
+    {key:'description',dataIndex:'description',title:'描述',align:'left'},
+    {key:'action',dataIndex:'action',title:'操作',align:'right'},
+];
+/** @var {Array<Object>} */
+const funcDataSource = ref([]);
+/** @var {Array<Object>} */
+const actColumns = [
     {key:'name',dataIndex:'name',title:'名称',align:'left'},
+    {key:'type',dataIndex:'type',title:'类型',align:'left'},
     {key:'action',dataIndex:'action',title:'操作',align:'right'},
 ];
 /** @var {Array<Object>} */
-const dataSource = ref([
-    {name:'加液机械臂',action:'复位 最小值 最大值'},
-    {name:'蠕动泵01',action:'复位 加液 回抽'},
-    {name:'蠕动泵02',action:'复位 加液 回抽'},
-    {name:'蠕动泵03',action:'复位 加液 回抽'},
-    {name:'蠕动泵04',action:'复位 加液 回抽'},
-    {name:'蠕动泵05',action:'复位 加液 回抽'},
-    {name:'蠕动泵06',action:'复位 加液 回抽'},
-    {name:'蠕动泵07',action:'复位 加液 回抽'},
-    {name:'蠕动泵08',action:'复位 加液 回抽'},
-    {name:'蠕动泵09',action:'复位 加液 回抽'},
-    {name:'蠕动泵10',action:'复位 加液 回抽'},
-    {name:'蠕动泵11',action:'复位 加液 回抽'},
-    {name:'蠕动泵12',action:'复位 加液 回抽'},
-    {name:'蠕动泵13',action:'复位 加液 回抽'},
-    {name:'蠕动泵14',action:'复位 加液 回抽'},
-    {name:'蠕动泵15',action:'复位 加液 回抽'},
-    {name:'蠕动泵16',action:'复位 加液 回抽'},
-]);
+const actDataSource = ref([]);
+// on mounted
+onMounted(mounted);
+
+// on mounted
+async function mounted() {
+    let client = ApiClient.getClient();
+    let response = await client.call('test/list');
+    funcDataSource.value = response.list;
+    response = await client.call('device/actuator-list');
+    actDataSource.value = response.list;
+}
+
+// actuactor exec
+async function actuatorExec(key, action, params) {
+    let client = ApiClient.getClient();
+    await client.call('test/actuator-execute', {
+        key, action, params,
+    });
+}
+
+// action functional test exec
+async function actionFunctionalTestExec(record) {
+    console.log(record);
+    let client = ApiClient.getClient();
+    await client.call('test/execute', {
+        name: record.name,
+    });
+}
+
+
 </script>
\ No newline at end of file
diff --git a/src/web/src/pages/main/contents/TestActuatorExecute.vue b/src/web/src/pages/main/contents/TestActuatorExecute.vue
new file mode 100644
index 0000000..afeae8e
--- /dev/null
+++ b/src/web/src/pages/main/contents/TestActuatorExecute.vue
@@ -0,0 +1,44 @@
+<template>
+  <div>
+    <template v-if="'Motor' === props.type">
+      <a-popover title="移动">
+        <template #content>
+          <a-input-number v-model:value="move.pos" size="small"/>
+          <a-button size="small" class="ml-1">执行</a-button>
+        </template>
+        <a-button size="small" class="ml-1">移动</a-button>
+      </a-popover>
+      
+        <a-button size="small" class="ml-1">旋转</a-button>
+        <a-button size="small" class="ml-1">复位</a-button>
+    </template>
+
+    <template v-if="'Servo' === props.type">
+      <a-button size="small" class="ml-1">移动</a-button>
+    </template>
+    
+    <template v-if="'PeristalticPump' === props.type">
+      <a-button size="small" class="ml-1">旋转</a-button>
+    </template>
+  </div>
+</template>
+<script setup>
+import ApiClient from '@/utils/ApiClient';
+/** @var {Object} */
+const props = defineProps({
+    type : String, // type
+});
+/** @var {Object} */
+const move = ref({pos:0});
+
+async function actionExecuteMove() {
+    let client = ApiClient.getClient();
+    client.call('device/actuator-execute', {
+        key: props.type,
+        action: 'move',
+        params: {
+            pos: move.value.pos,
+        },
+    })
+}
+</script>
\ No newline at end of file