<template>

  <div class="bigBox">
    <MOSTY.FromPage :title="props.title" @closeDialog="CloseEvent">
      <template #content>
        <MOSTY.Assort :title="'基本信息'" />
        <div class="fromBox">
          <el-form ref="ruleFormRef" :model="FromData" :rules="rules" :disabled="!props.saveBtnShow" label-width="140px"
            class="demo-ruleForm" status-icon :inline="true">
            <el-form-item label="报告名称" prop="reportname" style="width: 100%;">
              <el-input v-model="FromData.reportname" maxlength="100" autosize type="textarea" show-word-limit
                placeholder="请不要超过100个汉字"></el-input>
            </el-form-item>
            <el-form-item label="组织人:" prop="sponsor">
              <el-input v-model="FromData.sponsor" readonly style="width: 337px;">
                <template #append>
                  <el-button @click="ChooesDdld('01')">选择</el-button>
                </template>
              </el-input>
            </el-form-item>
            <el-form-item label="组织部门：" prop="initiatedep">
              <el-input v-model="FromData.initiatedep" style="width: 337px" disabled></el-input>
            </el-form-item>
            <el-form-item label="评价年份：" prop="assessyear">
              <el-date-picker v-model="FromData.assessyear" type="year" format="YYYY" value-format="YYYY"
                style="width: 337px" />
            </el-form-item>
            <el-form-item label="参与部门:" prop="joindepname" style="width: 100%;">
              <el-input v-model="FromData.joindepname" readonly style="width: 93%; margin-right: 10px"
                type="textarea" />
              <el-button type="primary" @click="ChooesDdld('03')">选择</el-button>

            </el-form-item>
            <el-form-item label="评审人员:" prop="assessor" style="width: 100%;">
              <el-input v-model="FromData.assessor" readonly style="width: 93%; margin-right: 10px" type="textarea" />
              <el-button type="primary" @click="ChooesDdld('02')">选择</el-button>
            </el-form-item>

            <el-form-item label="评价结论" v-if="['1'].includes(props.type)" style="width: 100%;">
              <el-input v-model="FromData.conclusion" maxlength="500" autosize type="textarea" show-word-limit
                placeholder="请不要超过500个汉字"></el-input>
            </el-form-item>
            <el-form-item label="备注：" style="width: 100%;">
              <el-input v-model="FromData.bz" maxlength="500" autosize type="textarea" show-word-limit
                placeholder="请不要超过500个汉字"></el-input>
            </el-form-item>
            <el-form-item label="附件：" style="width: 100%;">
              <MOSTY.Upload :width="'100%'" :isAutoWidth="true" :limit="5" :nopicer="true" :isImg="false"
                :gsgfList="['pdf', 'ofd', 'doc', 'docx', 'xls', 'xlsx', 'wps']" :ShowfileList="true"
                v-model="FromData.files" :showinput="true" :delrow="delrow">
              </MOSTY.Upload>
            </el-form-item>
          </el-form>
        </div>
      </template>
      <template #footer>

        <el-button type="primary" v-loading='loading' @click="addHander(ruleFormRef)" v-if="props.saveBtnShow">
          <el-icon>
            <DocumentChecked />
          </el-icon>
          <span>保存</span>
        </el-button>
        <el-button type="primary" @click="CloseEvent">
          <el-icon>
            <DocumentDelete />
          </el-icon>
          <span>关闭</span>
        </el-button>
      </template>
    </MOSTY.FromPage>
  </div>
  <!-- 选择参与部门: -->
  <ChooseDept v-if="showJkssbm" :formInfo="fromObj" :showDdld="showJkssbm" @closezzjg="closeJhss"
    @listdata="getSonValue" :zzlx="zzlx" />
  <!-- 选择负责人 :deptId="listQuery.orgCode" -->
  <ChooseUser v-model="chooseUserVisible" :Single="singleShow" :data="memberList" :leaderid="leaderid"
    @choosedUsers="getSonValue"></ChooseUser>
</template>

<script setup>
// 引入
import { reactive, onMounted, ref, defineProps, watch, getCurrentInstance } from "vue";
import ChooseUser from "@/components/MyComponents/ChooseUser/Leader.vue";
import ChooseDept from "@/components/MyComponents/ChooseDept/Depart.vue";
import { getApi, postApi } from "@/api/tobAcco_api.js";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
const emits = defineEmits(["close", "resttab"]);
const { proxy } = getCurrentInstance();
const chooseUserVisible = ref(false); //选择负责人弹窗
const memberList = ref([]); //成员选择的id回显
const cybmlist = ref([]);
const showJkssbm = ref(false); //选择部门
const leaderid = ref("");
const loading = ref(false)
const zzlx = ref(null);
const assessorlist = ref(null);
const singleShow = ref(true); //单选多选
//规则校验
const rules = reactive({
  reportname: [
    { required: true, message: "报告名称不能为空", trigger: "blur" }
  ],
  sponsor: [{ required: true, message: "组织人不能为空", trigger: "blur" }],
  assessyear: [
    { required: true, message: "评价年份不能为空", trigger: "blur" }
  ],
  joindepname: [
    { required: true, message: "参与部门不能为空", trigger: "blur" }
  ],
  assessor: [{ required: true, message: "评审人员不能为空", trigger: "blur" }]
});
const props = defineProps({
  // 判断展示字段
  saveBtnShow: {
    default: true,
    type: Boolean
  },
  orgcode: {
    default: "5200520100",
    type: String
  },
  // 标题
  title: {
    default: "",
    type: String
  },
  //id
  id: {
    default: null,
    type: String
  },
  editObj: {
    type: Object,
    default: () => { }
  }
});
const ruleFormRef = ref();
const isdisabled = ref(false);
const delrow = ref({}); //删除文件列表
const FromData = ref({});
onMounted(() => {
});
//监听当前弹窗类型
watch(
  () => props.id,
  (val) => {
    if (val) {
      getxqData(val);
    } else {
      // 名称自己填
      FromData.value.assessyear = new Date().getFullYear().toString();
    }
  },
  { deep: true, immediate: true }
);
//获取详情
function getxqData(id) {
  getApi({ id: id }, "/mosty-jcgl/lawComprep/getLawCompById").then((res) => {
    FromData.value = res;
  });
}
//点击带队领导选择按钮
function ChooesDdld(val) {
  zzlx.value = val;
  leaderid.value = "";
  if (val == "01") {
    singleShow.value = true;
    chooseUserVisible.value = true;
    leaderid.value = FromData.value.sponsorid;
  }
  //评审人员
  if (val == "02") {
    singleShow.value = false;
    chooseUserVisible.value = true;
    if (assessorlist.value) {
      memberList.value = assessorlist.value.map((item) => {
        return item.assessorid;
      });
    }
  }
  if (val == "03") {
    showJkssbm.value = true;
  }
}

const getSonValue = (value) => {
  if (zzlx.value == "01") {
    FromData.value.sponsor = value[0].userName;
    FromData.value.sponsorid = value[0].id;
    FromData.value.initiatedep = value[0].deptName;
    FromData.value.initiatedepid = value[0].deptId;
  }
  if (zzlx.value == "02") {
    let arr = [];
    let arrid = [];
    for (let i = 0; i < value.length; i++) {
      const element = value[i];
      element.zzlx = zzlx.value;
      arr.push(element.userName);
      arrid.push(element.id);
    }
    memberList.value = value.map((item) => {
      return item.id;
    });
    assessorlist.value = value.map((item) => {
      return {
        assessorid: item.id,
        assessor: item.userName
      };
    });
    FromData.value.assessor = arr.join(",");
    FromData.value.assessorid = arrid.join(",");
  }
  if (zzlx.value == "03") {
    let arr = [];
    let arr2 = [];
    for (let i = 0; i < value.length; i++) {
      const element = value[i];
      arr.push(element.orgName);
      arr2.push(element.orgCode);
    }
    cybmlist.value = value.map((item) => {
      return {
        joindepid: item.orgCode,
        joindepname: item.orgName
      };
    });
    FromData.value.joindepname = arr.toString();
    FromData.value.joindepid = arr2.toString();
  }
};

//清空数据
function reset() {
  FromData.value = {};
  props.id = null;
  isdisabled.value = false;
}
//关闭综合配置表
const CloseEvent = () => {
  if (props.saveBtnShow) {
    proxy.$modal.confirm('离开会丢失页面中修改的内容，确认离开吗？')
      .then(() => {
        // 关闭上一次的表单校验
        ruleFormRef.value.clearValidate();
        reset();
        emits("close");
      })
      .catch(() => {
        // catch error
      })
  } else {
    // 关闭上一次的表单校验
    ruleFormRef.value.clearValidate();
    reset();
    emits("close");
  }

};
const closeJhss = (val) => {
  showJkssbm.value = val;
};

//保存
const addHander = async (ruleFormRef) => {
  if (!ruleFormRef) return;
  await ruleFormRef.validate((valid) => {
    if (valid) {
      loading.value = true
      if (FromData.value) {
        FromData.value.files = FromData.value.files ? FromData.value.files.toString() : null;
        postApi(FromData.value, "/mosty-jcgl/lawComprep/lawCompSave").then(() => {
          if (props.title == "发起安全管理制度合法合规性评价") {
            ElMessage.success("新增成功");
          } else {
            ElMessage.success("修改成功");
          }
          reset();
          emits("close");
          emits("resttab", true);
        }).finally(() => {
          loading.value = false
        })
      }
    } else {
      ElMessage.error("请输入必填项!");
    }
  });
};

</script>

<style lang="scss" scoped>
.box_cont {
  height: 90vh;
  overflow: auto;
}



.ld_box {
  display: flex;
  margin-right: 20px;
}

.el-form {
  width: 80%;
  align-items: center;
  display: flex;
  justify-content: start;
  flex-wrap: wrap;
  margin: 10px auto;
}

.el-form-item {
  display: flex;
  margin-right: 20px;
}

.addbtn {
  margin-bottom: 10px;
}

.bigBox {
  display: block !important;
  box-sizing: border-box;
}
</style>