128 lines
3.6 KiB
Vue
128 lines
3.6 KiB
Vue
<script setup lang="ts">
|
|
import { $t } from '@/locales';
|
|
import { enableStatusOptions } from '@/constants/business';
|
|
import { SyncOutlined, SearchOutlined } from '@ant-design/icons-vue';
|
|
|
|
defineOptions({
|
|
name: 'logSearch'
|
|
});
|
|
|
|
|
|
|
|
interface Emits {
|
|
(e: 'reset'): void;
|
|
(e: 'search'): void;
|
|
}
|
|
|
|
defineProps<{
|
|
deptTreeData: Api.Common.CommonTree;
|
|
}>();
|
|
|
|
const emit = defineEmits<Emits>();
|
|
|
|
const model = defineModel<any>('model', { required: true });
|
|
|
|
/**记录开始结束时间 */
|
|
let queryRangePicker = ref<[string, string]>(['', '']);
|
|
|
|
function reset() {
|
|
// 重置表单
|
|
//formRef.value?.resetFields();
|
|
|
|
// 重置日期选择器
|
|
queryRangePicker.value = ['', ''];
|
|
|
|
// 确保 model 也被重置
|
|
model.value = {};
|
|
|
|
// 使用 nextTick 确保视图更新后检查
|
|
nextTick(() => {
|
|
console.log('视图更新后：', { ...model.value });
|
|
console.log(model);
|
|
});
|
|
emit('reset');
|
|
}
|
|
|
|
function search() {
|
|
if (!queryRangePicker.value) {
|
|
queryRangePicker.value = ['', ''];
|
|
}
|
|
model.value['params[beginTime]'] = queryRangePicker.value[0];
|
|
model.value['params[endTime]'] = queryRangePicker.value[1];
|
|
emit('search');
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<ACard :title="$t('common.search')" :bordered="false" class="card-wrapper">
|
|
<AForm :model="model" :label-width="80">
|
|
<ARow :gutter="[16, 16]" wrap>
|
|
<ACol :lg="6" :md="12" :xs="24">
|
|
<AFormItem :label="$t('page.manage.log.operIp')" name="operIp" class="m-0">
|
|
<AInput v-model:value="model.operIp" />
|
|
</AFormItem>
|
|
</ACol>
|
|
|
|
<ACol :lg="6" :md="12" :xs="24">
|
|
<AFormItem :label="$t('page.manage.log.module')" name="title" class="m-0">
|
|
<AInput v-model:value="model.title" />
|
|
</AFormItem>
|
|
</ACol>
|
|
|
|
|
|
<ACol :lg="6" :md="12" :xs="24">
|
|
<AFormItem :label="$t('page.manage.user.status')" name="status" class="m-0">
|
|
<ASelect v-model:value="model.status" :placeholder="$t('page.manage.user.form.status')" allow-clear>
|
|
<ASelectOption v-for="option in enableStatusOptions" :key="option.value" :value="option.value">
|
|
{{ $t(option.label) }}
|
|
</ASelectOption>
|
|
</ASelect>
|
|
</AFormItem>
|
|
</ACol>
|
|
|
|
<ACol :lg="6" :md="12" :xs="24">
|
|
<AFormItem :label="$t('page.manage.log.operName')" name="operName" class="m-0">
|
|
<AInput v-model:value="model.operName" />
|
|
</AFormItem>
|
|
</ACol>
|
|
|
|
|
|
|
|
|
|
<a-col :lg="8" :md="12" :xs="24">
|
|
<a-form-item :label="$t('page.manage.log.operTime')" name="queryRangePicker">
|
|
<a-range-picker v-model:value="queryRangePicker" allow-clear bordered show-time
|
|
value-format="YYYY-MM-DD HH:mm:ss" format="YYYY-MM-DD HH:mm:ss" style="width: 100%"></a-range-picker>
|
|
</a-form-item>
|
|
</a-col>
|
|
|
|
<ACol :lg="16" :md="12" :xs="24">
|
|
<AFormItem class="m-0">
|
|
<div class="w-full flex-y-center justify-end gap-8px">
|
|
|
|
<a-space :size="8">
|
|
<a-button @click="reset">
|
|
<template #icon>
|
|
<SyncOutlined />
|
|
</template>
|
|
{{ $t('common.reset') }}
|
|
</a-button>
|
|
<AButton type="primary" ghost @click="search">
|
|
<template #icon>
|
|
<SearchOutlined />
|
|
</template>
|
|
{{ $t('common.search') }}
|
|
</AButton>
|
|
</a-space>
|
|
|
|
</div>
|
|
</AFormItem>
|
|
</ACol>
|
|
|
|
</ARow>
|
|
</AForm>
|
|
</ACard>
|
|
</template>
|
|
|
|
<style scoped></style>
|