<template>
  <div class="add-project-container">
    <div class="add-project-content" v-loading="loading">
      <routerBack />

      <div class="tabs-content">
        <div class="project-tab-content">
          <div class="tab-content">
            <el-form :model="formData" :disabled="isPreview">
              <!-- 仅保留档案基本信息折叠项，删除所有无用折叠项 -->
              <el-collapse v-model="activeCollapse">
                <el-collapse-item title="档案基本信息" name="档案基本信息">
                  <el-row :gutter="20">
                    <!-- 所属项目ID（后端有对应字段） -->
                    <el-col :span="12">
                      <el-form-item label="项目信息" required>
                        <el-select
                          v-model="formData.projectId"
                          placeholder="请选择项目信息"
                          no-data-text="暂无数据"
                          @change="changeProject"
                        >
                          <el-option
                            v-for="item in projectList"
                            :key="item.id"
                            :label="item.projectName"
                            :value="item.id"
                          ></el-option>
                        </el-select>
                      </el-form-item>
                    </el-col>
                    <!-- 档案分类：绑定后端archiveCategory（非空），保留通用选择器 -->
                    <el-col :span="12">
                      <el-form-item label="档案分类" required>
                        <CommonSelector
                          v-model="formData.archiveCategory"
                          dictName="dafl"
                        />
                      </el-form-item>
                    </el-col>

                    <!-- 档案名称：绑定后端archiveName（非空），修正原重复的qc绑定 -->
                    <el-col :span="12">
                      <el-form-item label="档案名称" required>
                        <el-input
                          v-model="formData.archiveName"
                          placeholder="请输入档案名称"
                        />
                      </el-form-item>
                    </el-col>

                    <!-- 档案编号：绑定后端archiveNumber，修正原重复的qc绑定 -->
                    <el-col :span="12">
                      <el-form-item label="档案编号">
                        <el-input
                          v-model="formData.archiveNumber"
                          placeholder="请输入档案编号"
                        />
                      </el-form-item>
                    </el-col>

                    <!-- 档案日期：绑定后端archiveDate，保留时间选择器 -->
                    <el-col :span="12">
                      <el-form-item label="档案日期" required>
                        <el-date-picker
                          v-model="formData.archiveDate"
                          type="date"
                          format="YYYY-MM-DD"
                          value-format="YYYY-MM-DD"
                          placeholder="请选择档案日期"
                          style="width: 100%"
                        />
                      </el-form-item>
                    </el-col>

                    <!-- 附件上传：绑定后端fjsc（JSON类型），修正原bjdwtzgh绑定 -->
                    <el-col :span="24">
                      <el-form-item label="附件上传">
                        <FileUploader v-model="formData.fjsc" />
                      </el-form-item>
                    </el-col>

                    <!-- 备注：绑定后端remark，修正原bz绑定 -->
                    <el-col :span="24">
                      <el-form-item label="备注">
                        <el-input
                          v-model="formData.remark"
                          rows="4"
                          placeholder="请输入备注"
                          type="textarea"
                        ></el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                </el-collapse-item>
              </el-collapse>
            </el-form>
          </div>
        </div>
      </div>
      <div class="add-project-header">
        <div class="header-left"></div>
        <div class="header-right">
          <el-button type="default" @click="backClick">返回</el-button>
          <template v-if="!loading && !isPreview">
            <el-button type="primary" @click="saveClick">保存</el-button>
          </template>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup>
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
import { useRouter, useRoute } from "vue-router";
import { ElMessage } from "element-plus";
import { useUserStore } from "@/stores/user.js";
// 引入组件：仅保留实际用到的
import FileUploader from "@/components/FileUploader/index.vue";
import routerBack from "@/components/common/routerBack.vue";

// 初始化必要全局变量：删除无用的token/options
const userStore = useUserStore();
const router = useRouter();
const route = useRoute();
const { proxy } = getCurrentInstance();

// 折叠面板：仅保留档案基本信息，删除所有无用展开项
const activeCollapse = ref(["档案基本信息"]);

// 表单核心数据：**完全匹配后端RcTzdagl模型字段**，删除所有无用字段
const formData = reactive({
  fjsc: [], // 附件上传（JSON数组，绑定上传组件）
});

// 页面核心状态：保留必要的加载/预览/编辑ID
const loading = ref(false); // 全局加载状态
const isPreview = ref(!!route.query.isPreview); // 预览模式（表单禁用）
const rcTzdaglId = ref(route.query.id || ""); // 当前编辑的档案ID（匹配表名）
const projectList = ref([]); // 项目下拉列表数据

// 接口请求：仅保留**实际用到的**，删除所有无用的合计/新增/删除方法
// 获取项目下拉列表（绑定所属项目）
const getProjectData = (params = {}) => {
  proxy.$post({
    url: "/api/project/listProject",
    data: {
      page: 1,
      pagesize: 1000,
      attributes: [],
      menuType: "xmjc",
      ...params,
    },
    callback: (data) => {
      projectList.value = data.rows || [];
    },
  });
};

// 选择项目后同步项目名称（前端展示用，后端无该字段，保留不影响）
const changeProject = (val) => {
  const selectItem = projectList.value.find((item) => item.id === val);
  if (selectItem) {
    formData.projectName = selectItem.projectName; // 临时字段，仅前端展示
  }
};

// 获取档案单条记录详情（编辑/预览用）：删除无用的wtyys/tzfhs赋值
const getRcTzdaglDetail = () => {
  if (!rcTzdaglId.value) return;

  loading.value = true;
  proxy.$post({
    url: "/api/project/getTzdagl",
    data: { id: rcTzdaglId.value },
    callback: (data) => {
      loading.value = false;
      Object.assign(formData, data); // 直接赋值，后端返回字段与前端完全匹配
    },
    error: () => (loading.value = false), // 补充错误回调，防止加载状态卡死
  });
};

// 页面操作：仅保留必要的返回/保存
const backClick = () => {
  router.back(-1);
};

// 保存/提交表单：★补全非空校验★、删除无用的wtyys/tzfhs提交、匹配后端字段
const saveClick = () => {
  // 基础非空校验：匹配后端allowNull:false的字段
  if (!formData.projectId) {
    ElMessage.warning("请选择所属项目");
    return;
  }
  if (!formData.archiveCategory) {
    // 档案分类非空校验
    ElMessage.warning("请选择档案分类");
    return;
  }
  if (!formData.archiveName) {
    // 档案名称非空校验
    ElMessage.warning("请输入档案名称");
    return;
  }

  loading.value = true;
  // 区分新增/编辑接口
  const url = rcTzdaglId.value
    ? "/api/project/updateTzdagl"
    : "/api/project/createTzdagl";

  // 提交数据：仅传递后端需要的字段，删除无用的wtyys/tzfhs
  const submitData = {
    ...formData,
    projectId: formData.projectId + "", // 项目ID转字符串，保持原处理逻辑
  };

  proxy.$post({
    url: url,
    data: submitData,
    callback: () => {
      loading.value = false;
      ElMessage.success(rcTzdaglId.value ? "编辑成功" : "新增成功");
      router.back(-1);
    },
    error: (err) => {
      // 补充错误回调，处理接口报错+关闭加载
      loading.value = false;
      // 唯一键/其他报错提示（可选）
      if (err.msg?.includes("unique") || err.msg?.includes("重复")) {
        ElMessage.error("档案编号已存在，请更换后重试");
      }
    },
  });
};

// 页面初始化：仅保留必要的接口调用
onMounted(() => {
  getProjectData(); // 获取项目下拉列表
  if (rcTzdaglId.value) {
    getRcTzdaglDetail(); // 编辑/预览时加载档案详情
  }
});
</script>

<style scoped lang="less"></style>
