85 lines
1.8 KiB
Vue
85 lines
1.8 KiB
Vue
<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>
|