优化菜单结构

src/views/system/myTask/components/search.vue

@@ -0,0 +1,51 @@
+<template>
+  <div style="display: flex; justify-content: space-between">
+    <a-space :size="20" style="flex-wrap: wrap">
+      <a-tabs
+        type="card"
+        tabPosition="top"
+        v-model:activeKey="where.status"
+        @change="search"
+      >
+        <a-tab-pane key="0" tab="待处理" />
+        <a-tab-pane key="1" tab="已完成" />
+      </a-tabs>
+    </a-space>
+    <a-space :size="10" style="flex-wrap: wrap; margin-right: 20px">
+      <a-input-search
+        allow-clear
+        placeholder="请输入关键词"
+        v-model:value="where.keywords"
+        @pressEnter="search"
+        @search="search"
+      />
+      <a-button @click="reset">重置</a-button>
+    </a-space>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import { TaskParam } from '@/api/oa/task/model';
+  import useSearch from '@/utils/use-search';
+
+  const emit = defineEmits<{
+    (e: 'search', where: TaskParam): void;
+  }>();
+
+  // 表单数据
+  const { where, resetFields } = useSearch<TaskParam>({
+    keywords: '',
+    commander: undefined
+  });
+
+  /*  重置 */
+  const reset = () => {
+    resetFields();
+    search();
+  };
+
+  /* 搜索 */
+  const search = () => {
+    emit('search', where);
+  };
+</script>