<template>
  <el-dialog :title="props.title" v-model="isShowDetail" width="800px" :before-close="closed">
    <div class="config">
      <el-form ref="Fromrefs" label-width="auto" :model="info" label-suffix="：" :rules="rules" :disabled="!props.isEdit"
        label-position="right" style="display: flex; justify-content: start; flex-wrap: wrap; width: 100% !important">
        <!-- <el-form-item label="企业名称" prop="baOrgName" v-if="!props.title.includes('新增')">
          <el-input v-model="info.baOrgName" style="width: 250px" disabled />
        </el-form-item> -->
        <el-form-item label="企业名称" prop="orgCode">
          <el-select v-model="info.orgCode" clearable style="width: 250px" :disabled="info.sourceId ? true : false">
            <el-option v-for="item in companyEnums" :key="item.orgId" :label="item.orgNmae"
              :value="item.orgId"></el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="统计周期" prop="reportingYear" v-if="info.sourceId">
          <el-input v-model="info.yearStr" style="width: 250px" disabled />
        </el-form-item>

        <el-form-item label="姓名" prop="remark">
          <el-input v-model="info.remark" style="width: 250px" />
        </el-form-item>

        <el-form-item label="岗位类别" prop="traineeCode">
          <!-- <el-input v-model="info.traineeName"  style="width: 250px;" /> -->
          <MOSTY.DictRidioAndSelect :dictData="D_BGWLB" v-model="info.traineeCode" selectType="select"
            style="width: 250px" :disabled="info.sourceId ? true : false" />
        </el-form-item>

        <el-form-item label="培训总学时" prop="neAnnualTotalHour">
          <el-input-number style="width: 250px" v-model="info.neAnnualTotalHour" :min="0" />
        </el-form-item>
        <el-form-item v-if="info.traineeCode == 1" label="授课次数" prop="mainHeadTeachingQty">
          <el-input-number v-model="info.mainHeadTeachingQty" style="width: 250px" :min="0" />
        </el-form-item>
      </el-form>
    </div>
    <template #footer>
      <span class="dialog-footer">
        <el-button type="primary" v-loading="loadingShow" @click="handleSave(Fromrefs)"
          v-if="props.isEdit">保存</el-button>
        <el-button @click="closed">关闭</el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script setup>
import { ref, reactive, toRefs, onMounted, getCurrentInstance } from "vue"
import { getApi, postApi } from "@/api/tobAcco_api.js"
import * as rule from "@/utils/rules.js"
import { ElMessage } from "element-plus"
import * as MOSTY from "@/components/MyComponents/index"
const { proxy } = getCurrentInstance()
const { D_BGWLB } = proxy.$dict("D_BGWLB")
import { getItem } from "@/utils/storage"
const companyEnums = ref([])
const props = defineProps({
  title: {
    type: String,
    default: ""
  },
  detailId: {
    type: String,
    default: ""
  },
  id: {
    type: String,
    default: ""
  },
  isEdit: {
    type: Boolean,
    default: true
  },
  orgObj: Object
})
const loadingShow = ref(false)
const emits = defineEmits(["close"])
const isShowDetail = ref(true)
const rules = reactive({
  ...rule.numbernineRule({ validator: true, require: true, iszs: true, firstNum: 8, lastNum: 1 }, "neAnnualTotalHour"),
  ...rule.numberzzsRule({ validator: true, require: true, num: 99999 }, "mainHeadTeachingQty"),
  traineeCode: [{ required: true, message: "请选择岗位类别", trigger: "blur" }],
  remark: [{ required: true, message: "请输入姓名", trigger: "blur" }],
  orgCode: [{ required: true, message: "请选择企业名称", trigger: "blur" }]
})
const info = ref({})
const Fromrefs = ref()
const closed = () => {
  if (!Fromrefs.value) return
  if (props.isEdit) {
    proxy.$modal.confirm('离开会丢失页面中修改的内容，确认离开吗？')
      .then(() => {
        Fromrefs.value.clearValidate()
        emits("close")
      })
      .catch(() => {
        // catch error
      })
  } else {
    Fromrefs.value.clearValidate()
    emits("close")
  }

}
// 获取详情
const getDetail = () => {
  let _url = props.id ? "/mosty-jcgl/data/manageTrainInfo/getLsjlDetail" : "/mosty-jcgl/data/manageTrainInfo/getDetailById"
  let id = props.id ? props.id : props.detailId
  getApi({ id }, _url).then(res => {
    if (res) {
      info.value = res
      let _bn = info.value.reportCycleCode == 2 ? "下半年" : "上半年"
      info.value.yearStr = info.value.reportingYear + "年-" + _bn
    } else {
      info.value.orgCode = props.orgObj.orgCode
      info.value.orgName = props.orgObj.orgName
    }

  })
}
//保存

const handleSave = async formEl => {
  if (!formEl) return
  await formEl.validate(async (valid, fields) => {
    if (valid) {
      loadingShow.value = true
      if (info.value.yearStr) {
        delete info.value.yearStr
      }
      if (!info.value.sourceId) {
        // info.value.orgCode = getItem("deptId").ssdwid
        info.value.traineeName = D_BGWLB.value.find(item => item.value == info.value.traineeCode).label
        postApi(info.value, "/mosty-jcgl/data/manageTrainInfo/add")
          .then(res => {
            ElMessage({
              message: "新增成功",
              type: "success"
            })
            emits("close", true)
          })
          .finally(() => {
            loadingShow.value = false
          })
      } else {
        postApi(info.value, "/mosty-jcgl/data/manageTrainInfo/update")
          .then(res => {
            ElMessage({
              message: "保存成功",
              type: "success"
            })
            emits("close", true)
          })
          .finally(() => {
            loadingShow.value = false
          })
      }

    } else {
      ElMessage.warning("请输入必填项！！！")
    }
  })
}

onMounted(() => {
  if (!props.title.includes("新增")) getDetail()
  getApi({}, "/mosty-jcgl/dataCommon/companyEnum").then(res => {
    if (res) companyEnums.value = res
  })
})
</script>
<style scoped lang="scss">
::v-deep .el-form-item--default {
  margin-left: 10px;
}
</style>
