<!--
 * @Author: lixg lixg@dongwu-inc.com
 * @Date: 2022-12-20 17:00:37
 * @LastEditors: lixg lixg@dongwu-inc.com
 * @LastEditTime: 2022-12-20 17:59:40
 * @FilePath: /fe-manage/src/components/student/ChangeLevelModal.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <a-modal
      style="padding: 0"
      :closable="true"
      :visible="visiblene"
      :footer="null"
      centered="true"
      wrapClassName="changeModal"
  >
    <div class="con">
      <div class="header">
        <div class="inhe">
          <div class="mod"></div>
          <div class="tz">调整关卡</div>
          <div class="mg" @click="closeChangeModal"></div>
        </div>
      </div>
      <div class="mid">
        <div class="inher">
          <!-- <div class="cur">当前关卡：关卡2</div> -->
          <div class="select">
            <a-select
                v-model:value="selectStage"
                style="width: 100%"
                placeholder="请选择关卡"
                :options="option"
                allowClear
            ></a-select>
          </div>
          <div class="btn">
            <button
                class="sameb btn1"
                @click="closeChangeModal"
                style="cursor: pointer"
            >
              取消
            </button>
            <button
                class="sameb btn2"
                @click="changelevel"
                style="cursor: pointer"
            >
              确定
            </button>
          </div>
        </div>
      </div>
    </div>
  </a-modal>
</template>
<script setup>
import {computed, defineEmits, defineProps, ref} from "vue";
import {moveStudent} from "@/api/index1";
import {message} from "ant-design-vue";

const props = defineProps({
  visiblene: {
    type: Boolean,
    default: false,
  },
  stage: {
    type: Array,
    default: () => [],
  },
  ids: {
    type: Array,
    default: () => [],
  },
});

const option = computed(() => {
  return props.stage.map(e => ({label: e.name, value: e.id}))
})

const selectStage = ref()

const emit = defineEmits({})

const closeChangeModal = () => {
  emit("update:visiblene", false);
};
const changelevel = () => {
  if(!selectStage.value){
    message.error("请选择关卡")
    return
  }
  emit("update:visiblene", false);
  emit('finash', false)
  moveStudent({targetId: selectStage.value, ids: props.ids}).then(()=>{
    emit('finash', true)
  })
};
//获取关卡列表
</script>
