2
0

fix:终端设备界面搜索栏重置功能修复

This commit is contained in:
zhongzm
2025-02-14 11:59:42 +08:00
parent f587e4f673
commit bf149afbbb
2 changed files with 34 additions and 22 deletions

View File

@@ -58,7 +58,7 @@ import { useElementSize } from '@vueuse/core';
import { fetchTerminalList } from '@/service/api/auth'; import { fetchTerminalList } from '@/service/api/auth';
import { Card as ACard, Table as ATable, Tag as ATag } from 'ant-design-vue'; import { Card as ACard, Table as ATable, Tag as ATag } from 'ant-design-vue';
import TerminalSearch from './modules/terminal-search.vue'; import TerminalSearch from './modules/terminal-search.vue';
import { formatStorage, formatTime } from '@/utils/units'; import { formatStorage } from '@/utils/units';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
const { t } = useI18n(); const { t } = useI18n();
@@ -115,7 +115,6 @@ const {
getData, getData,
mobilePagination, mobilePagination,
searchParams, searchParams,
resetSearchParams
} = useTable({ } = useTable({
apiFn: async (params: Api.Device.TerminalDeviceParams) => { apiFn: async (params: Api.Device.TerminalDeviceParams) => {
try { try {
@@ -256,9 +255,19 @@ const handleSearch = () => {
getData(); getData();
}; };
// 添加重置处理函数 // 修改重置处理函数
const handleReset = () => { const handleReset = () => {
resetSearchParams(); // 保存当前的 pageSize
const currentPageSize = searchParams.pageSize;
// 重置搜索参数
searchParams.clientName = '';
searchParams.clientDeviceType = '';
searchParams.clientMac = '';
searchParams.pageNum = 1;
searchParams.pageSize = currentPageSize;
// 重新获取数据
getData(); getData();
}; };
</script> </script>

View File

@@ -3,7 +3,7 @@
<AForm layout="inline"> <AForm layout="inline">
<AFormItem :label="t('page.terminal.name')"> <AFormItem :label="t('page.terminal.name')">
<AInput <AInput
v-model:value="model.clientName" v-model:value="formModel.clientName"
:placeholder="t('page.terminal.pledevice')" :placeholder="t('page.terminal.pledevice')"
allow-clear allow-clear
class="w-200px" class="w-200px"
@@ -21,7 +21,7 @@
<!-- </AFormItem>--> <!-- </AFormItem>-->
<AFormItem :label="t('page.terminal.mac')"> <AFormItem :label="t('page.terminal.mac')">
<AInput <AInput
v-model:value="model.clientMac" v-model:value="formModel.clientMac"
:placeholder="t('page.terminal.plemac')" :placeholder="t('page.terminal.plemac')"
allow-clear allow-clear
class="w-200px" class="w-200px"
@@ -51,7 +51,10 @@
<script setup lang="ts"> <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'; import { Form as AForm, FormItem as AFormItem, Input as AInput, Button as AButton, Space as ASpace, Card as ACard } from 'ant-design-vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { computed } from 'vue';
const { t } = useI18n(); const { t } = useI18n();
interface Props { interface Props {
model: { model: {
clientName?: string; clientName?: string;
@@ -69,18 +72,18 @@ const props = withDefaults(defineProps<Props>(), {
const emit = defineEmits(['update:model', 'search', 'reset']); const emit = defineEmits(['update:model', 'search', 'reset']);
// 使用计算属性来处理双向绑定
const formModel = computed({
get: () => props.model,
set: (val) => emit('update:model', val)
});
const search = () => { const search = () => {
emit('search'); emit('search');
}; };
const reset = () => { const reset = () => {
emit('update:model', { // 只触发重置事件
...props.model,
clientName: '',
clientDeviceType: '',
clientMac: '',
pageNum: 1
});
emit('reset'); emit('reset');
}; };
</script> </script>