docking-vue/src/views/database/connect_enterprises_management/info.vue

<template>
  <div>
    <el-divider content-position="left">企业基础信息</el-divider>
    <app-info-builder :options :info>
      <template #servicePlatformId>
        {{ target.serviceName }}
      </template>
      <template #companyStatus>
        {{ translationStatus(info.companyStatus, STATUS_LIST) }}
      </template>
    </app-info-builder>
    <el-divider content-position="left">企业属性信息</el-divider>
    <app-info-builder :options="propsOptions" :info> </app-info-builder>
    <el-divider content-position="left">对接上级平台信息</el-divider>
    <div v-for="(item, index) in thirdList" :key="index" class="mb-10">
      <app-info-builder :options="thirdListOptions" :info="item">
        <template #thirdPlatformId>
          {{ fnPlatformName(target.thirdList, item.thirdPlatformId) }}
        </template>
      </app-info-builder>
    </div>
  </div>
</template>

<script setup>
import { useRoute } from "vue-router";
import AppInfoBuilder from "@/components/info_builder/index.vue";
import { ref, computed } from "vue";
import {
  getBusCompanyInfo,
  getBusServicePlatformListAll,
} from "@/request/database.js";
import { WHETHER_LIST, STATUS_LIST } from "@/assets/js/constant.js";
import { translationStatus } from "@/assets/js/utils.js";
const route = useRoute();
const { id } = route.query;
const info = ref({});
const thirdList = ref([]);
const target = ref({});

const options = [
  { key: "companyName", label: "企业名称" },
  { key: "code", label: "统一社会信用代码" },
  { key: "area", label: "属地" },
  { key: "sectorName", label: "所属行业" },
  { key: "address", label: "经营地址" },
  { key: "companyStatus", label: "企业状态" },
  { key: "companyAddress", label: "地理位置" },
  { key: "companyContacts", label: "主要负责人" },
  { key: "companyMobile", label: "负责人电话" },
  { key: "servicePlatformId", label: "服务平台" },
];
const propsOptions = computed(() => [
  {
    key: "isMajorHazard",
    label: "是否重大危险源企业",
    value: translationStatus(info.value.isMajorHazard, WHETHER_LIST),
  },
  {
    key: "isOpenMajorHazard",
    label: "是否开启重大危险源数据推送",
    value: translationStatus(info.value.isOpenMajorHazard, WHETHER_LIST),
  },
  {
    key: "isKeyProcess",
    label: "是否重点工艺企业",
    value: translationStatus(info.value.isKeyProcess, WHETHER_LIST),
  },
  {
    key: "isOpenKeyProcess",
    label: "是否开启重点工艺企业数据推送",
    value: translationStatus(info.value.isOpenKeyProcess, WHETHER_LIST),
  },
  {
    key: "isSpecialInspection",
    label: "是否重点专项检查企业",
    value: translationStatus(info.value.isSpecialInspection, WHETHER_LIST),
  },
  {
    key: "isOpenSpecialInspection",
    label: "是否开启专项检查数据推送",
    value: translationStatus(info.value.isOpenSpecialInspection, WHETHER_LIST),
  },
  {
    key: "isDustExplosion",
    label: "是否粉尘涉爆企业",
    value: translationStatus(info.value.isDustExplosion, WHETHER_LIST),
  },
]);
const thirdListOptions = [
  { key: "thirdPlatformId", label: "上级对接平台" },
  { key: "companyCode", label: "企业编码" },
  { key: "majorHazardCode", label: "重大危险源编码" },
  { key: "accessKey", label: "密钥" },
  { key: "rsaPublicKey", label: "公钥" },
  { key: "url", label: "对接URL" },
  { key: "iv", label: "对接IV" },
  { key: "code", label: "企业CODE" },
  { key: "appid", label: "企业APPID" },
  { key: "secret", label: "企业SECRET" },
];
const fnGetData = async () => {
  const { data } = await getBusCompanyInfo({ id: id });
  info.value = data;
  if (info.value.province) {
    info.value.area = `${info.value.province},${info.value.city}, ${info.value.county}`;
  }
  if (info.value.longitude) {
    info.value.address = `${info.value.longitude}-${info.value.latitude}`;
  }
  thirdList.value = info.value.thirdList;
  thirdList.value.forEach((item) => {
    if (item.majorHazardCode && item.majorHazardCode.length > 0) {
      const codeArr = JSON.parse(item.majorHazardCode);
      item.majorHazardCode = codeArr.map((item) => item.code).join(",");
    }
  });
  const { data: servicePlatformList } = await getBusServicePlatformListAll();
  target.value = servicePlatformList.find(
    (item) => item.id === info.value.servicePlatformId
  );
};

fnGetData();

function fnPlatformName(params, id) {
  if (!params) return;
  const name = params.find((item) => item.id === id);
  return name.platformName;
}
</script>

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