<template>
  <div class="add-project-container">
    <div class="add-project-content" v-loading="loading">
      <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 class="tabs-content">
        <div class="project-tab-content">
          <div class="tab-content">
            <!-- 表单模型绑定表字段formData，保留原有布局/禁用逻辑 -->
            <el-form :model="formData" :label-width="200" :disabled="isPreview">
              <el-row :gutter="20">
                <!-- 文件名称 → 绑定wjmc -->
                <el-col :span="12">
                  <el-form-item label="文件名称" required>
                    <el-input
                      v-model="formData.wjmc"
                      placeholder="请输入文件名称"
                    />
                  </el-form-item>
                </el-col>

                <!-- 编制年度 → 绑定nd -->
                <el-col :span="12">
                  <el-form-item label="编制年度" required>
                    <el-date-picker
                      v-model="formData.nd"
                      type="year"
                      format="YYYY"
                      value-format="YYYY"
                      placeholder="请选择编制年度"
                      picker-options="{ disabledDate: (date) => date > new Date() }"
                    />
                  </el-form-item>
                </el-col>

                <!-- 编制人 → 绑定bzr -->
                <el-col :span="12">
                  <el-form-item label="编制人">
                    <el-input
                      v-model="formData.bzr"
                      placeholder="请输入编制人"
                    />
                  </el-form-item>
                </el-col>

                <!-- 编制人部门 → 绑定bzrbm -->
                <el-col :span="12">
                  <el-form-item label="编制人部门">
                    <el-input
                      v-model="formData.bzrbm"
                      placeholder="请输入编制人部门"
                    />
                  </el-form-item>
                </el-col>

                <!-- 附件 → 绑定fjsc -->
                <el-col :span="24">
                  <el-form-item label="附件" label-width="200">
                    <FileUploader v-model="formData.fjsc" />
                  </el-form-item>
                </el-col>
              </el-row>
            </el-form>
          </div>
        </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 FileUploader from "../../components/FileUploader/index.vue";

// 路由&全局实例（原有逻辑保留）
const router = useRouter();
const route = useRoute();
const { proxy } = getCurrentInstance();

// ========== 核心状态（删除无用变量，匹配表名命名） ==========
const loading = ref(false); // 加载状态
const isPreview = ref(!!route.query.isPreview); // 是否预览模式
const rcXxbsId = ref(route.query.id || ""); // 建设期投资检查记录ID（匹配表名RcXxbs）
// 所属项目ID/主表ID（从路由传参/全局获取，根据实际业务调整，这里预留）
const projectId = ref(route.query.projectId || "");
const sourceId = ref(route.query.sourceId || "");

// ========== 表单核心数据（完全匹配RcXxbs表结构，无冗余字段） ==========
const formData = reactive({
  fjsc: [], // 附件上传（JSON类型，匹配表的JSON）

  creator: proxy.$store?.getters?.userId || "", // 创建人ID（从全局状态取，无则空）
});

// ========== 接口请求（匹配建设期投资检查业务，修改接口名/地址） ==========
// 获取建设期投资检查单条记录详情（编辑/预览时用）
const getRcXxbsDetail = () => {
  loading.value = true;
  proxy.$post({
    url: "/api/project/getXxbs", // 替换为实际的【建设期投资检查】详情接口
    data: { id: rcXxbsId.value },
    callback: (data) => {
      loading.value = false;
      // 接口返回数据直接赋值（字段完全匹配，无需额外转换）
      Object.assign(formData, data);
      // 附件字段容错：确保是数组
      formData.fjsc = data.fjsc || [];
    },
    error: () => (loading.value = false),
  });
};

// ========== 页面操作方法（保留原有交互，删除无用校验） ==========
// 返回上一页
const backClick = () => {
  router.back(-1);
};

// 保存/提交表单（新增/编辑统一处理，无冗余校验）
const saveClick = () => {
  // 赋值隐藏字段（所属项目/主表ID，根据实际业务调整赋值逻辑）
  formData.projectId = projectId.value;
  formData.sourceId = sourceId.value;

  loading.value = true;
  // 新增/编辑接口区分（匹配建设期投资检查业务）
  const url = rcXxbsId.value
    ? "/api/project/updateXxbs" // 编辑接口
    : "/api/project/createXxbs"; // 新增接口

  proxy.$post({
    url: url,
    data: { ...formData },
    callback: () => {
      loading.value = false;
      ElMessage.success(rcXxbsId.value ? "编辑成功" : "新增成功");
      router.back(-1);
    },
    error: () => {
      loading.value = false;
    },
  });
};

// ========== 页面初始化（仅编辑/预览时加载详情，无冗余逻辑） ==========
onMounted(() => {
  // 有记录ID时，加载详情数据（编辑/预览）
  if (rcXxbsId.value) {
    getRcXxbsDetail();
  }
});
</script>

<style scoped lang="less">
@import "@/styles/verticalManages.less";

.add-project-container {
  padding: 20px;
  background: #f5f7fa;
  min-height: calc(100vh - 60px);
}

.add-project-content {
  background: #fff;
  border-radius: 4px;
  padding: 20px;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.04);
}

.add-project-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 1px solid #ebeef5;
}

// 表单样式优化（保留原有，无冗余）
:deep(.el-form-item__label) {
  font-weight: 500;
}
// 附件上传区域间距（保留原有）
:deep(.el-upload) {
  margin-bottom: 10px;
}
</style>
