<template>
  <el-dialog :title="props.title" v-model="isShowDetail" width="1120px" :before-close="closed">
    <div class="config">
      <el-form ref="ruleFormRef" label-width="auto" :model="info" label-suffix="：" :rules="rules"
        :disabled="props.title.includes('详情')" label-position="left">
        <el-row>
          <el-col :span="11">
            <el-form-item label="公司名称">
              <el-input v-model="info.orgName" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="统计年度">
              <el-input v-model="info.reportingYear" disabled />
            </el-form-item>
            <!-- <el-form-item label="统计年度" prop="reportingYear">
              <el-select clearable v-model="info.reportingYear">
                <el-option v-for="item in filterYear(7)" :key="item.value" :label="item.label"
                  :value="item.value"></el-option>
              </el-select>
            </el-form-item> -->
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="11">
            <el-form-item label="统计周期">
              <el-select clearable v-model="info.reportCycleCode" disabled>
                <el-option v-for="item in D_BZ_HALF_YEAR" :key="item.value" :label="item.label" :value="item.value" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="部位名称" prop="fsisName">
              <el-input v-model="info.fsisName" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="11">
            <el-form-item label="建筑物面积" prop="fsisBdArea">
              <el-input-number v-model="info.fsisBdArea" :precision="2" style="width: 100%" :min="0" />
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="从业人员数量" prop="fsisEmployPersonQty">
              <el-input-number v-model="info.fsisEmployPersonQty" :precision="0" style="width: 100%" :min="0" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="11">
            <el-form-item label="火灾种类" prop="fsisFireTypeCode">
              <MOSTY.DictRidioAndSelect :dictData="D_BZ_XFZDBWHZLX" v-model="info.fsisFireTypeCode"
                selectType="select" />
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="危险等级" prop="fsisHazardLevelCode">
              <MOSTY.DictRidioAndSelect :dictData="D_BZ_XFZDBWWXDJ" v-model="info.fsisHazardLevelCode"
                selectType="select" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <template #footer>
      <span class="dialog-footer">
        <el-button type="primary" @click="onSave" v-if="!props.title.includes('详情')" style="margin-right: 10px">
          <el-icon>
            <DocumentChecked />
          </el-icon>
          <span>确定</span></el-button>
        <el-button @click="closed"> <el-icon>
            <DocumentDelete />
          </el-icon>
          <span>关闭</span></el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script setup>
import { ref, reactive, onMounted, getCurrentInstance } from "vue";
import { getApi, postApi } from "@/api/tobAcco_api.js";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
import * as rule from "@/utils/rules.js";
import { filterYear } from "@/utils/auth.js"
const { proxy } = getCurrentInstance();
const { D_BZ_XFZDBWHZLX, D_BZ_XFZDBWWXDJ, D_BZ_HALF_YEAR } = proxy.$dict("D_BZ_XFZDBWHZLX", "D_BZ_XFZDBWWXDJ", "D_BZ_HALF_YEAR");

const props = defineProps({
  title: {
    type: String,
    default: ""
  },
  detail: {
    type: String,
    default: ""
  },
  type: {
    type: String,
    default: ""
  },
  rowItem: {
    type: Object,
    default: () => ({})
  },
  query: Object,
});
const emit = defineEmits(["close"]);
const isShowDetail = ref(true);
const ruleFormRef = ref();
const isAdd = ref(props.title.includes('新增'))
const rules = reactive({
  ...rule.numbernineRule({ validator: true, require: true, iszs: true, firstNum: 8, lastNum: 2 }, "fsisBdArea"),
  ...rule.numberzzsRule({ validator: true, require: true, num: 99999 }, "fsisEmployPersonQty"),
  'fsisName': [{ required: true, message: '部位名称', trigger: 'blur' }],
  'fsisFireTypeCode': [{ required: true, message: '火灾类型', trigger: 'blur' }],
  'fsisHazardLevelCode': [{ required: true, message: '危险等级', trigger: 'blur' }],
});
const info = ref({});
const onSave = async () => {
  await ruleFormRef.value.validate((valid, fields) => {
    if (valid) {
      info.value.fsisFireTypeName = D_BZ_XFZDBWHZLX.value.find(v => v.value == info.value.fsisFireTypeCode).label
      info.value.fsisHazardLevelName = D_BZ_XFZDBWWXDJ.value.find(v => v.value == info.value.fsisHazardLevelCode).label
      if (Array.isArray(info.value.checkFileId) && info.value.checkFileId.length) {
        info.value.checkFileId = info.value.checkFileId.join(",")
      }
      if (Array.isArray(info.value.designFileId) && info.value.designFileId.length) {
        info.value.designFileId = info.value.designFileId.join(",")
      }
      if (Array.isArray(info.value.studyFileId) && info.value.studyFileId.length) {
        info.value.studyFileId = info.value.studyFileId.join(",")
      }
      const url = isAdd.value ? "/mosty-jcgl/data/importantPart/saveImportantPartInfo" : "/mosty-jcgl/data/importantPart/editImportantPartInfo"
      postApi(info.value, url)
        .then(() => {
          ElMessage.success(isAdd.value ? "新增成功" : "编辑成功");
          emit("close", true);
        })
        .finally(() => {
        });
    }
  });
};
onMounted(() => {
  if (isAdd.value) {
    info.value = {
      orgCode: props.rowItem.orgCode && props.rowItem.orgCode.replace('XN', ''),
      orgName: props.rowItem.orgName,
      statId: props.rowItem.id,
      reportingYear: props.rowItem.reportingYear,
      reportCycleCode: props.query.bn
    }
  } else if (props.type == 'report') {
    info.value = props.detail
    info.value.reportCycleCode = props.query.bn
  } else {
    getApi({}, `/mosty-jcgl/data/importantPart/selectOne/${props.detail.sourceId}`).then((res) => {
      info.value = res;
    });
  }
});
const closed = () => {
  if(!ruleFormRef.value) return
  if (!props.title.includes('详情')) {
    proxy.$modal.confirm('离开会丢失页面中修改的内容，确认离开吗？')
      .then(() => {
        emit("close");
      })
      .catch(() => {
        // catch error
      })
  } else {
    emit("close");
  }

};
</script>
<style scoped lang="scss">
::v-deep .el-dialog__body {
  height: 100% !important;
}

.config {
  height: 55vh;
}

::v-deep .el-form-item--default {
  margin-left: 10px;
}
</style>
