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

defineOptions({ name: 'ApiAccessLogSearch' });

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

const model = defineModel<Api.SystemLog.ApiAccess.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: 'resultCode',
    label: '结果码',
    type: 'input',
    placeholder: '请输入结果码',
    transformValue: value => {
      const text = String(value ?? '').trim();
      if (!text) return undefined;
      const resultCode = Number(text);
      return Number.isFinite(resultCode) ? resultCode : undefined;
    },
    resolveValue: value => (value === null || value === undefined ? '' : String(value))
  },
  {
    key: 'duration',
    label: '最小时长(ms)',
    type: 'input',
    placeholder: '请输入执行时长下限',
    transformValue: value => {
      const text = String(value ?? '').trim();
      if (!text) return undefined;
      const duration = Number(text);
      return Number.isFinite(duration) ? duration : undefined;
    },
    resolveValue: value => (value === null || value === undefined ? '' : String(value))
  },
  // {
  //   key: 'userType',
  //   label: '用户类型',
  //   type: 'dict',
  //   placeholder: '请选择用户类型',
  //   dictCode: SYSTEM_USER_TYPE_DICT_CODE,
  //   filterable: true
  // },
  {
    key: 'beginTime',
    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>
