<template>
  <div class="part-box is-filter">
    <el-form label-width="200px">
      <el-form-item label="是否缺考">
        <el-select
          v-model="searchModel.isMissing"
          placeholder="请选择"
          clearable
          style="width: 120px"
        >
          <el-option label="是" :value="true" />
          <el-option label="否" :value="false" />
        </el-select>
      </el-form-item>
      <el-form-item label="准考证号">
        <el-input
          v-model.trim="searchModel.examCardNo"
          placeholder="多个准考证号用英文逗号分隔"
          :rows="4"
          type="textarea"
          style="width: 400px"
        />
      </el-form-item>
      <el-form-item label="科目">
        <el-select
          v-model="searchModel.subjectRangeMode"
          placeholder="请选择"
          style="width: 200px"
        >
          <el-option
            v-for="(val, key) in DATA_SCOPE_MODE"
            :key="key"
            :label="val"
            :value="key"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="">
        <el-input
          v-model.trim="searchModel.subjectCodes"
          placeholder="多个科目代码用英文逗号分隔"
          :rows="4"
          type="textarea"
          style="width: 400px"
        />
      </el-form-item>
      <el-form-item label="考点">
        <el-select
          v-model="searchModel.examPointRangeMode"
          placeholder="请选择"
          style="width: 200px"
        >
          <el-option
            v-for="(val, key) in DATA_SCOPE_MODE"
            :key="key"
            :label="val"
            :value="key"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="">
        <el-input
          v-model.trim="searchModel.examPoint"
          placeholder="多个考点用英文逗号分隔"
          type="textarea"
          :rows="4"
          style="width: 400px"
        />
      </el-form-item>
      <el-form-item label="客观题是否有识别结果">
        <el-select
          v-model="searchModel.objectiveQuestionHasResult"
          placeholder="请选择"
          clearable
          style="width: 120px"
        >
          <el-option label="是" :value="true" />
          <el-option label="否" :value="false" />
        </el-select>
      </el-form-item>
      <el-form-item label="客观总分">
        <el-select
          v-model="searchModel.objectiveTotalScoreMode"
          placeholder="请选择"
          style="width: 100px"
        >
          <el-option
            v-for="(val, key) in NUMBER_SCOPE_MODE"
            :key="key"
            :label="val"
            :value="key"
          />
        </el-select>
        <el-input-number
          v-model="searchModel.objectiveTotalScore"
          :min="0"
          :max="9999"
          :step="0.1"
          :precision="1"
          :controls="false"
          step-strictly
          placeholder="请输入"
          style="width: 200px"
        />
      </el-form-item>
      <el-form-item label="主观总分">
        <el-select
          v-model="searchModel.subjectiveTotalScoreMode"
          placeholder="请选择"
          style="width: 100px"
        >
          <el-option
            v-for="(val, key) in NUMBER_SCOPE_MODE"
            :key="key"
            :label="val"
            :value="key"
          />
        </el-select>
        <el-input-number
          v-model="searchModel.subjectiveTotalScore"
          :min="0"
          :max="9999"
          :step="0.1"
          :precision="1"
          :controls="false"
          step-strictly
          placeholder="请输入"
          style="width: 200px"
        />
      </el-form-item>
      <el-form-item label="试卷类型">
        <el-input
          v-model.trim="searchModel.paperType"
          placeholder="请输入"
          clearable
          style="width: 200px"
        />
      </el-form-item>
      <el-form-item v-if="queryResult" label="查询结果">
        <el-input :value="queryResult.length" readonly style="width: 120px" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="queryData">查询数量</el-button>
        <el-button
          v-if="queryResult && queryResult.length"
          type="primary"
          @click="startProcess"
          >开始处理</el-button
        >
      </el-form-item>
    </el-form>
  </div>
</template>

<script setup lang="ts">
  import { reactive, ref } from 'vue';
  import { ElMessage } from 'element-plus';
  import { getResultCheckDataList } from '@/api/check';
  import type { ResultCheckDataListFilter } from '@/api/types/check';
  import { DATA_SCOPE_MODE, NUMBER_SCOPE_MODE } from '@/constants/enumerate';

  defineOptions({
    name: 'ResultCheck',
  });

  const searchModel = reactive<ResultCheckDataListFilter>({
    isMissing: undefined,
    examCardNo: '',
    subject: '',
    subjectRangeMode: 'BELONG',
    examPoint: '',
    examPointRangeMode: 'BELONG',
    objectiveQuestionHasResult: undefined,
    objectiveTotalScore: undefined,
    objectiveTotalScoreRangeMode: 'GREATER_THAN',
    subjectiveTotalScore: undefined,
    subjectiveTotalScoreRangeMode: 'GREATER_THAN',
    paperType: '',
  });

  const queryResult = ref<number[] | null>(null);
  const loading = ref(false);
  async function queryData() {
    loading.value = true;
    try {
      const result = await getResultCheckDataList({ ...searchModel });
      queryResult.value = result || [];
    } catch (error) {
      console.error('查询失败:', error);
    } finally {
      loading.value = false;
    }
  }

  function startProcess() {
    ElMessage.info('开始处理功能待实现');
  }
</script>
