<template>
  <el-dialog title="添加考试人员" v-model="isShowDialog" width="600px" :before-close="beforeClose">
    <div class="form-box">
      <el-form ref="ruleFormRef" :model="FromData" :rules="rules" label-width="155px" class="demo-ruleForm">
      <el-form-item label="考试人员" prop="userid">
        <inputUser v-model:ids="FromData.userid" :Single="false" v-model:cName="FromData.username" width="300"
          @change="founderChange"></inputUser>
      </el-form-item>
    </el-form>
    </div>

    <template #footer>
      <el-button type="primary" @click="save">保存</el-button>
      <el-button @click="CloseEvent">取消</el-button>
    </template>
  </el-dialog>
</template>


<script setup>
import { ref, defineEmits, defineExpose } from 'vue'
import { getApi, postApi } from "@/api/tobAcco_api.js"
import inputUser from "@/views/fxgk/jcss/components/MostCom/inputUser.vue";
import { ElMessage } from 'element-plus'

const props = defineProps({

  row: {
    type: Object,
    default: () => { }
  }
})
const emits = defineEmits(['ok'])
const rules = ref({
  userid: [
    { required: true, message: '请选择考试人员', trigger: 'change' }
  ]
})
const FromData = ref({
  userid: '',
  username: ''
})
const isShowDialog = ref(false)
const save = async () => {
  if(!FromData.value.userid) return ElMessage.error("请选择考试人员");
  const userIds = FromData.value.userid.split(",")
  postApi({ examId: props.row.id, userIds: userIds }, '/mosty-jcgl/paper/addPeople').then(() => {
    ElMessage.success("添加成功");
    emits('ok')
    CloseEvent()
  })
}
const CloseEvent = () => {
  isShowDialog.value = false
}

const founderChange = (val) => {
}

const open = () => {
  isShowDialog.value = true
}
defineExpose({
  open
})
</script>

<style scoped>
/* .form-box {
console.log('.form-box {

}: ', .form-box {

});

} */
</style>
