<template>
  <div class="page_container">
    <bg-breadcrumb></bg-breadcrumb>
    <div class="page_content">
      <bg-form-gap title="注册信息"></bg-form-gap>
      <bg-detail-table2 class="register_info" :list="instanceData.approveBasicInfo">
      </bg-detail-table2>
      <bg-form-gap title="审批信息"></bg-form-gap>
      <bg-detail-table2 class="approve_info" :list="instanceData.approveInfo"> </bg-detail-table2>
    </div>
  </div>
</template>

<script setup>
import { reactive, onBeforeMount } from "vue";
import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
import { useRoute } from "vue-router";
import axios from "@/request/http.js";
import { ElMessage } from "element-plus";
import { dateStringTransform } from "@/services/helper.js";

const route = useRoute();

const instanceData = reactive({
  approveBasicInfo: [
    {
      key: "organization_name",
      label: "所属组织",
      value: "",
      // slot: "approvalStatus",
    },
    {
      key: "business_name",
      label: "业务系统名称",
      value: "",
    },
    {
      key: "system_account",
      label: "账号",
      value: "",
    },
    {
      key: "phone",
      label: "手机号",
      value: "",
    },
    {
      key: "develop_name",
      label: "开发厂商名称",
      value: "",
    },
    {
      key: "created_time",
      label: "提交时间",
      value: "",
    },
    {
      key: "contact_name",
      label: "联系人",
      value: "",
    },
    {
      key: "contact_phone",
      label: "联系人手机号",
      value: "",
    },
    {
      key: "business_desc",
      label: "业务系统描述",
      value: "",
    },
  ],
  approveInfo: [
    {
      key: "status",
      label: "审核状态",
      value: "",
    },
    {
      key: "approval_by",
      label: "审核人",
      value: "",
    },
    {
      key: "approval_time",
      label: "审批时间",
      value: "",
    },
    {
      key: "comments",
      label: "审批意见",
      value: "",
    },
  ],
});
onBeforeMount(() => {
  getApproveInfo();
});
const getApproveInfo = () => {
  axios
    .get(`/apaas/system/v5/user/approval/detail/${route.query.id}`)
    .then((res) => {
      if (res.data.code == 200) {
        const result = res.data.data || {};
        instanceData.approveBasicInfo.forEach((item) => {
          // if (item.key === "created_time") {
          //   item.value = dateStringTransform(result[item.key]);
          //   return;
          // }
          item.value = result[item.key];
        });
        instanceData.approveInfo.forEach((item) => {
          if (item.key === "status") {
            item.value = ["待审批", "通过", "驳回"][result[item.key]];
            return;
          }
          if (item.key === "approval_time") {
            item.value = dateStringTransform(result[item.key]);
            return;
          }
          item.value = result[item.key];
        });
      } else {
        ElMessage.error(res.data.data);
      }
    })
    .catch((err) => {
      ElMessage.error(err);
    });
};
</script>

<style lang="scss" scoped>
.page_content {
  position: relative;
  padding: 24px 0 68px 24px;
  .register_info,
  .approve_info {
    margin-bottom: 24px;
    width: 960px;
  }
}
</style>
