<script setup lang="ts">
import { computed } from 'vue';
import { SYSTEM_USER_TYPE_DICT_CODE } from '@/constants/dict';
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 fields = computed<SearchField[]>(() => [
  {
    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: 'userId',
    label: '用户编号',
    type: 'input',
    placeholder: '请输入用户编号'
  },
  {
    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>
