feat:AP设备界面接通

src/views/device/apdevice/modules/device-search.vue

@@ -0,0 +1,84 @@
+<template>
+  <ACard :bordered="false" class="search-card">
+    <AForm layout="inline">
+      <AFormItem label="设备名称">
+        <AInput
+          v-model:value="model.deviceName"
+          placeholder="请输入设备名称"
+          allow-clear
+          class="w-200px"
+          @pressEnter="search"
+        />
+      </AFormItem>
+      <AFormItem label="MAC地址">
+        <AInput
+          v-model:value="model.deviceMac"
+          placeholder="请输入MAC地址"
+          allow-clear
+          class="w-200px"
+          @pressEnter="search"
+        />
+      </AFormItem>
+      <AFormItem>
+        <ASpace>
+          <AButton type="primary" :loading="loading" @click="search">
+            <template #icon>
+              <icon-mdi-search />
+            </template>
+            搜索
+          </AButton>
+          <AButton @click="reset">
+            <template #icon>
+              <icon-mdi-refresh />
+            </template>
+            重置
+          </AButton>
+        </ASpace>
+      </AFormItem>
+    </AForm>
+  </ACard>
+</template>
+
+<script setup lang="ts">
+import { Form as AForm, FormItem as AFormItem, Input as AInput, Button as AButton, Space as ASpace, Card as ACard } from 'ant-design-vue';
+
+interface Props {
+  model: {
+    deviceName?: string;
+    deviceMac?: string;
+    pageNum: number;
+    pageSize: number;
+  };
+  loading?: boolean;
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  loading: false
+});
+
+const emit = defineEmits(['update:model', 'search', 'reset']);
+
+const search = () => {
+  emit('search');
+};
+
+const reset = () => {
+  emit('update:model', {
+    ...props.model,
+    deviceName: '',
+    deviceMac: '',
+    pageNum: 1
+  });
+  emit('reset');
+};
+</script>
+
+<style scoped>
+.search-card {
+  margin-bottom: 16px;
+}
+
+.w-200px {
+  width: 200px;
+}
+</style>