<template>
  <LeftNav />
  <div class="main-container wrap main-fullScreen">
    <div class="filterBody">
      <div class="flexWrap">
        <div class="flex-item-1">性别</div>
        <div class="flex-item-1 tags">
          <el-radio-group v-model="state.sportsForm.sex">
            <el-radio label="男">男</el-radio>
            <el-radio label="女">女</el-radio>
          </el-radio-group>
        </div>
      </div>
      <div class="flexWrap">
        <div class="flex-item-15">100米跑成绩（秒）</div>
        <div class="flex-item-1 tags">
          <el-input v-model="state.sportsForm.sprint" type="number" step="0.01" />
        </div>
      </div>
      <div class="flexWrap">
        <div class="flex-item-15">立定跳远成绩（米）</div>
        <div class="flex-item-1 tags">
          <el-input v-model="state.sportsForm.jump" type="number" step="0.01" />
        </div>
      </div>
      <div class="flexWrap">
        <div class="flex-item-15">原地推铅球成绩（米）</div>
        <div class="flex-item-1 tags">
          <el-input v-model="state.sportsForm.shotPut" type="number" step="0.01" />
        </div>
      </div>
      <div class="flexWrap">
        <div class="flex-item-1 tags">
          <el-button type="primary" @click="submitSportsForm">提交体育成绩</el-button>
        </div>
      </div>
    </div>
    <!-- 原有表格代码保持不变 -->
    <div class="tableData filterBody" v-if="state.result && state.result.length > 0">
      <div class="flexWrap">
        <h3>分数</h3>
      </div>
        <div class="flexWrap">
          <div>100米：</div>
          <div class="flex-item-1 tags">
            {{state.result[0]}}
          </div>
        </div>
      <div class="flexWrap">
        <div>立定跳远：</div>
        <div class="flex-item-1 tags">
          {{state.result[1]}}
        </div>
      </div>
      <div class="flexWrap">
        <div>原地推球：</div>
        <div class="flex-item-1 tags">
          {{state.result[2]}}
        </div>
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">import { inject, onMounted, reactive } from 'vue';
import { getSystemName, isNull } from '@/utils/tool';
import { useRouter } from 'vue-router';
import StaticConstant from '@/utils/StaticConstant';
import axiosInstance from "@/utils/http";
import ApiConstant from "@/utils/ApiConstant";

const router = useRouter();
document.title = '轻松算投档|' + getSystemName()

const state = reactive({
  dataList: [] as any,
  flag: true,
  selectForm: {
    batch: '', // 批次
    culturalScore: '', // 文化分
    professionalScore: '', // 统考分
    professionalCategory: '',
  },
  // 新增体育成绩表单数据
  sportsForm: {
    sex: '男', // 性别
    sprint: null, // 100米跑成绩
    jump: null, // 立定跳远成绩
    shotPut: null, // 原地推铅球成绩
  },
  result: [],
  // 批次
  batchArray: [{ label: '本科批', value: '本科' }, { label: '高职高专批', value: '高职高专' }],
  batchIndex: 0,
  scoreInfo: {} as any,
  professionalCategoryList: StaticConstant.professionalCategoryList, // 专业类型列表
  vipInfo: {
    vipLevel: 0,
  } as any,
});

// 原有方法保持不变
onMounted(() => {
});

// 新增提交体育成绩方法
function submitSportsForm() {
  const formData = {
    sex: state.sportsForm.sex,
    sprint: state.sportsForm.sprint,
    jump: state.sportsForm.jump,
    shotPut: state.sportsForm.shotPut
  };
  console.log('提交的体育成绩数据：', formData);
  if(!formData.sprint || !formData.jump || !formData.shotPut) return
  // 这里可以添加提交表单的逻辑，例如调用API
  axiosInstance({
    url: ApiConstant.Score.getJson,
    method: 'post',
    data: {
      key: 'sportsScore',
      year: 2025,
      ...state.sportsForm,
    },
    //showLoading: false,//是否显示加载图标
  }).then((response: AxiosResponse) => {
    return response?.data
  }).then((data) => {
    if (data.success) {
      state.result = data.result
    }
  }).catch((error: any) => {
    console.log(error);
  }).finally(() => {
    state.flag = false
  });
}

// 其他原有方法保持不变
</script>

<style scoped lang="scss">/* 原有样式保持不变 */
</style>
