<template>
  <div class="container_wrap full" v-loading="fullscreenLoading">
    <div class="content_main">
      <ContentWrap id="id-baseInfo" title="数据申请信息" description="" :isExpand="baseInfoExpand" :expand-swicth="true"
        class="mb16" @expand="(v) => baseInfoExpand = v">
        <Form ref="baseInfoFormRef" :itemList="baseInfoFormItems" formId="base-info-form" :rules="baseInfoFormRules"
          col="col3" />
      </ContentWrap>
      <ContentWrap id="id-approveInfo" title="流程审批" expandSwicth style="margin-top: 15px" :isExpand="expandApprove"
        @expand="(v) => expandApprove = v">
        <ApprovalProcess ref="approvalProcessRef" v-if="deploymentId" :deploymentId="deploymentId"
          :processInstanceId="processInstanceId">
        </ApprovalProcess>
      </ContentWrap>
    </div>
    <div class="bottom_tool_wrap">
      <el-button @click="cancel">取消</el-button>
      <el-button @click="save" v-preReClick>保存</el-button>
      <el-button type="primary" @click="submit" v-preReClick>提交审批</el-button>
    </div>
  </div>
</template>

<script lang="ts" setup name="productApplicationEdit">
import { getCamundaDeploymentId } from "@/api/modules/workFlowService";
import {
  getRegisterCatalogDetail
} from "@/api/modules/dataAsset";
import useUserStore from "@/store/modules/user";
import useDataProductApplicationStore from "@/store/modules/productApplication";
import { useValidator } from '@/hooks/useValidator';
const { required } = useValidator();

const { proxy } = getCurrentInstance() as any;

const userStore = useUserStore();
const productApplicationStore = useDataProductApplicationStore();
const route = useRoute();
const router = useRouter();
const userData = JSON.parse(localStorage.userData);
const fullPath = route.fullPath;

const fullscreenLoading = ref(false);
const baseInfoExpand = ref(true);
const expandApprove = ref(true);

const deploymentId = ref('');
const processInstanceId = ref('');

const baseInfoFormRef = ref();

const baseInfoFormItems = ref([{
  label: '产品名称',
  type: 'label',
  field: 'damName',
  col: 'link',
  default: '-',
  click: () => {
    //TODO
    debugger
    router.push({
      name: 'productDetail',
      query: {
        id: route.query.id,
        type: 'view'
      }
    })
  }
},
{
  label: '产品编码',
  type: 'input',
  placeholder: '请输入',
  field: 'productCode',
  default: '-',
  disabled: true
},
{
  label: '产品类型',
  type: 'input',
  placeholder: '请输入',
  field: 'damTypeName',
  default: '-',
  disabled: true
},
{
  label: "预计使用期限",
  type: "date-picker",
  field: "useDateRange",
  default: null,
  placeholder: "开始时间~结束时间",
  clearable: true,
  disabledDate: (date) => {
    const today = new Date();
    // 将 today 设置为 00:00:00，只比较日期部分（本地时间）
    const todayStart = new Date(
      today.getFullYear(),
      today.getMonth(),
      today.getDate()
    );

    // 将 date 也转换为本地日期的开始时间（避免 UTC 问题）
    const dateStart = new Date(
      date.getFullYear(),
      date.getMonth(),
      date.getDate()
    );

    // 禁用 dateStart < todayStart 的日期（即今天之前）
    return dateStart.getTime() < todayStart.getTime();
  },
  required: true,
},
{
  label: "数据范围",
  type: "date-picker",
  field: "useDataDateRange",
  default: null,
  placeholder: "开始时间~结束时间",
  clearable: true,
  required: true,
},
{
  label: '产品发布机构',
  type: 'input',
  placeholder: '请输入',
  field: 'productPublisherName',
  default: '',
  disabled: true
},
{
  label: '数据粒度说明',
  type: 'textarea',
  placeholder: '请输入需要的需求字段',
  field: 'dataDescription',
  default: '',
  block: true,
  maxlength: 500,
  clearable: true,
  required: true,
},
{
  label: '使用场景描述',
  type: 'textarea',
  placeholder: '请输入使用该数据产品的场景描述信息',
  field: 'useDescription',
  default: '',
  block: true,
  maxlength: 500,
  clearable: true,
  required: true,
},
])

const baseInfoFormRules = ref({
  useDateRange: [{
    type: 'array', required: true, message: '请选择预计使用期限', trigger: 'change',
  }],
  useDataDateRange: [{
    type: 'array', required: true, message: '请选择数据范围', trigger: 'change',
  }],
  dataDescription: [required('请输入数据粒度说明')],
  useDescription: [required('请输入使用场景描述')]
})

const cancel = () => {
  proxy.$openMessageBox("当前页面尚未保存，确定放弃修改吗？", () => {
    userStore.setTabbar(userStore.tabbar.filter((tab: any) => tab.fullPath !== fullPath));
    router.push({
      name: 'productApplicationManage'
    });
  }, () => {
    proxy.$ElMessage.info("已取消");
  });
}

const save = () => {
  // 保存不检验。
}

const submit = () => {
  baseInfoFormRef.value?.ruleFormRef?.validate().then((valid, errorItem) => {
    if (valid) {
      let formInline = baseInfoFormRef.value.formInline;
      //  fullscreenLoading.value = true;
      //  listingSavePortal(params).then((res: any) => {
      //   fullscreenLoading.value = false;
      //     if (res?.code == proxy.$passCode) {
      //       proxy.$ElMessage.success('提交审批成功');
      //       userStore.setTabbar(userStore.tabbar.filter((tab: any) => tab.fullPath !== fullPath));
      //       productApplicationStore.setIsRefresh(true);
      //       router.push({
      //         name: "productApplicationManage",
      //       });
      //     } else {
      //       res?.msg && proxy.$ElMessage.error(res.msg);
      //     }
      //   }).catch((res) => {
      //     fullscreenLoading.value = false;
      //   });
    } else {
      var obj = Object.keys(errorItem);
      baseInfoFormRef.value.ruleFormRef.scrollToField(obj[0]);
    }
  })
}

onActivated(() => {
  let tab: any = userStore.tabbar.find((tab: any) => tab.fullPath == fullPath);
  let detailType = route.query.type;
  let name = route.query.name;
  if (tab) {
    switch (detailType) {
      case 'edit':
        tab.meta.title = `编辑-${name}`;
        break;
      case 'redit':
        tab.meta.title = `编辑-${name}`;
        break;
      default:
        tab.meta.title = '新增数据申请';
    }
    document.title = tab.meta.title;
  };
})

onBeforeMount(() => {
  // getCamundaDeploymentId('10016', userData.tenantGuid, userData.staffGuid).then((res: any) => {
  //   if (res.code == proxy.$passCode) {
  //     deploymentId.value = res.data;
  //   } else {
  //     proxy.$ElMessage.error(res.msg);
  //   }
  // })
  fullscreenLoading.value = true;
  getRegisterCatalogDetail(route.query.guid).then((res: any) => {
    fullscreenLoading.value = false;
    if (res?.code == proxy.$passCode) {
      let detail = res.data || {};
      baseInfoFormItems.value[0].default = <string>route.query.damName;
      baseInfoFormItems.value[1].default = detail.productCode;
      baseInfoFormItems.value[2].default = detail.damTypeName;
    } else {
      res?.msg && proxy.$ElMessage.error(res.msg);
    }
  })
})

</script>

<style lang="scss" scoped>
.content_main {
  height: calc(100% - 40px);
  padding: 16px;
  overflow: hidden auto;
  position: sticky;
}

.bottom_tool_wrap {
  height: 40px;
  padding: 0 16px;
  border-top: 1px solid #d9d9d9;
  display: flex;
  justify-content: center;
  align-items: center;
}

:deep(.el-form) {
  .link {
    color: var(--el-color-primary);
    cursor: pointer;
    line-height: 32px;
  }
}
</style>