日志管理+任务管理

src/views/manage/log/modules/log-search.vue

@@ -0,0 +1,127 @@
+<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.beginTime = queryRangePicker.value[0];
+  model.value.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.useTime')" 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>