<template>
  <el-dialog v-model="props.innerShow" @close="closeDialog" width="1000px" :rules="rules" :before-close="handleClose"
    :title="props.title" append-to-body>
    <el-form ref="formRef" :model="form" label-position="right" label-width="150px" :rules="rules"
      style="width: 100%;display: block;" :inline="true">
      <el-form-item label="排查项内容：" prop="itemName">
        <el-input v-model="form.itemName" type="textarea" :row="5" placeholder="请输入排查项内容" style="width: 741px;" />
      </el-form-item>
      <el-form-item prop="yhNote" label="隐患说明：">
        <el-input v-model="form.yhNote" type="textarea" :row="5" placeholder="请输入隐患说明" style="width: 741px;" />
      </el-form-item>
      <el-form-item prop="yhLv" label="隐患等级：">
        <el-select v-model="form.yhLv" style="width: 280px;" placeholder="请选择隐患等级">
          <el-option v-for="item in yhdjlist" :disabled="item.disabled" :key="item.value" :label="item.label"
            :value="item.value" />
        </el-select>
      </el-form-item>
      <el-form-item prop="yhFlag" label="标红项：">
        <el-select v-model="form.yhFlag" style="width: 280px;" placeholder="请选择标红项">
          <el-option v-for="item in props.dict.NYHBZ" :key="item.value" :label="item.label" :value="item.value" />
        </el-select>
      </el-form-item>
      <el-form-item label="是否必须上传图片：" prop="isPic">
        <el-select v-model="form.isPic" style="width: 280px;" placeholder="请选择是否必须上传图片">
          <el-option v-for="item in props.dict.NSFBXSCTP" :key="item.value" :label="item.label" :value="item.value" />
        </el-select>
      </el-form-item>
    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="submitForm(formRef)">
          <el-icon>
            <DocumentChecked />
          </el-icon>
          <span>保存</span>
        </el-button>
        <el-button @click="handleClose" type="primary">
          <el-icon>
            <DocumentDelete />
          </el-icon>
          <span>关闭</span>
        </el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup>
// 引入
import { ref, onMounted, defineProps, defineEmits, watch, getCurrentInstance } from "vue";
import { ElMessage } from "element-plus";
import { getSysDictByCode } from "@/api/sysDict"; //引入封装数字字典接口
import { postApi } from "@/api/tobAcco_api.js";
const { proxy } = getCurrentInstance();
const rules = {
  itemName: { required: true, message: '请输入排查项内容', trigger: 'blur' },
  yhNote: { required: true, message: '请输入隐患说明', trigger: 'blur' },
  yhLv: { required: true, message: '请选择隐患等级', trigger: 'blur' },
  yhFlag: { required: true, message: '请选择标红项', trigger: 'blur' },
  isPic: { required: true, message: '请选择是否必须上传图片', trigger: 'blur' }
}
// 数据
const yhdjlist = ref([])
const formRef = ref(null);
const props = defineProps({
  innerShow: {
    type: Boolean,
    default: false
  },
  title: {
    type: String,
    default: "新增排查项"
  },
  formValue: {
    type: Object,
    default: ""
  },
  dict: {
    type: String,
    default: { D_DBZ_YHDJ: [], NSFBXSCTP: [], NYHBZ: [] }
  }
});
const emits = defineEmits(["changeVi"]);
const form = ref({
  itemName: "",
  yhNote: "",
  yhFlag: "",
  isPic: "",
  itemSource: "",
  yhLv: "B",
  orgtype: 'S'
});
// 初始化
onMounted(() => {
  getSysDictByCode({ dictCode: "D_DBZ_YHDJ" }).then((res) => {
    if (res) {
      res.itemList.forEach((item) => {
        item.label = item.zdmc;
        item.value = item.dm;
        if (item.dm == '4') {
          // filterqx('isaqbm') != '1' &&
          item.disabled = true
        } else {
          item.disabled = false
        }
      });
      yhdjlist.value = res.itemList

    }
  });
  if (props.formValue) {
    form.value = props.formValue;
  }
});
watch(
  () => props.formValue,
  () => {
    form.value = props.formValue;
  },
  { deep: true }
);
// 方法
const submitForm = (formEl) => {
  if (!formEl) return;
  formEl.validate((valid) => {
    if (valid) {
      if (props.title == "新增排查项") {
        form.value.orgtype = 'S'
        form.value.addtype = '1'
        postApi(form.value, "/mosty-jcgl/checklib/addPcx").then((res) => {
          ElMessage.success("新增成功");
          emits("changeVi", false);
        });
      } else {
        postApi(form.value, "/mosty-jcgl/checklib/updatePcx").then((res) => {
          ElMessage.success("修改成功");
          emits("changeVi", false);
        });
      }
    } else {
      return false;
    }
  });
};
const handleClose = () => {
  proxy.$modal.confirm('离开会丢失页面中修改的内容，确认离开吗？')
    .then(() => {
      emits("changeVi", false);
    })
    .catch(() => {
      // catch error
    })

};

</script>

<style lang="scss" scoped>
::v-deep .el-dialog__body {
  color: #000000 !important;
}

.el-form {
  display: block !important;
}
</style>