fix:终端设备界面搜索栏重置功能修复
This commit is contained in:
@@ -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>
|
||||||
|
|||||||
@@ -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>
|
||||||
|
|||||||
Reference in New Issue
Block a user