<script setup lang="ts">
import { computed } from 'vue';
import { SYSTEM_REQUEST_METHOD_DICT_CODE } from '@/constants/dict';
import TableSearchFields, { type SearchField } from '@/components/custom/table-search-fields.vue';

defineOptions({ name: 'OperateLogSearch' });

const emit = defineEmits<{
  reset: [];
  search: [];
}>();

const model = defineModel<Api.SystemLog.Operate.SearchParams>('model', { required: true });

const props = defineProps<{
  userOptions: Array<{ label: string; value: string }>;
}>();

const fields = computed<SearchField[]>(() => [
  {
    key: 'userId',
    label: '操作人',
    type: 'select',
    placeholder: '请选择操作人',
    options: props.userOptions,
    filterable: true
  },
  {
    key: 'type',
    label: '模块类型',
    type: 'input',
    placeholder: '请输入操作模块类型'
  },
  {
    key: 'requestMethod',
    label: '请求方式',
    type: 'dict',
    placeholder: '请选择请求方式',
    dictCode: SYSTEM_REQUEST_METHOD_DICT_CODE,
    filterable: true
  },
  {
    key: 'subType',
    label: '操作名',
    type: 'input',
    placeholder: '请输入操作名'
  },
  {
    key: 'createTime',
    label: '操作时间',
    type: 'dateRange',
    placeholder: '请选择操作时间',
    valueFormat: 'YYYY-MM-DD HH:mm:ss',
    format: 'YYYY-MM-DD HH:mm:ss'
  }
]);
</script>

<template>
  <TableSearchFields v-model="model" :fields="fields" :columns="4" @reset="emit('reset')" @search="emit('search')" />
</template>
