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

defineOptions({ name: 'ApiErrorLogSearch' });

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

const model = defineModel<Api.SystemLog.ApiError.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: 'applicationName',
    label: '应用名',
    type: 'input',
    placeholder: '请输入应用名'
  },
  {
    key: 'requestUrl',
    label: '请求地址',
    type: 'input',
    placeholder: '请输入请求地址'
  },
  {
    key: 'processStatus',
    label: '处理状态',
    type: 'dict',
    placeholder: '请选择处理状态',
    dictCode: INFRA_API_ERROR_LOG_PROCESS_STATUS_DICT_CODE,
    filterable: true
  },
  // {
  //   key: 'userType',
  //   label: '用户类型',
  //   type: 'dict',
  //   placeholder: '请选择用户类型',
  //   dictCode: SYSTEM_USER_TYPE_DICT_CODE,
  //   filterable: true
  // },
  {
    key: 'exceptionTime',
    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>
