EmploymentSite/vue/src/views/jobUserManager/jobFair/detail.vue

<template>
  <div class="card-edit">
    <a-divider orientation="left">活动基本信息</a-divider>
    <a-descriptions bordered>
      <a-descriptions-item label="活动名称">{{ jobFair.name }}</a-descriptions-item>
      <a-descriptions-item label="主办单位">{{ jobFair.zbUnit }}</a-descriptions-item>
      <a-descriptions-item label="承办单位">{{ jobFair.cbUnit }}</a-descriptions-item>
      <a-descriptions-item label="活动地址">{{ jobFair.address }}</a-descriptions-item>
      <a-descriptions-item label="企业数量">{{ jobFair.companyCount }}</a-descriptions-item>
      <a-descriptions-item label="活动时间">
        {{ dayjs(jobFair.startTime).format('YYYY-MM-DD') }}
        至
        {{ dayjs(jobFair.endTime).format('YYYY-MM-DD') }}
      </a-descriptions-item>
      <a-descriptions-item label="联系人">{{ jobFair.userName }}</a-descriptions-item>
      <a-descriptions-item label="联系电话">{{ jobFair.userMrobile }}</a-descriptions-item>
      <a-descriptions-item label="所属县区">{{ jobFair.regionName }}</a-descriptions-item>
      <a-descriptions-item label="摊位数">{{ jobFair.boothCount }}</a-descriptions-item>
      <a-descriptions-item label="展位数量">{{ jobFair.displayCount }}</a-descriptions-item>
      <a-descriptions-item label="是否制作海报">{{ jobFair.isMake ? '是' : '否' }}</a-descriptions-item>
      <a-descriptions-item label="经度">{{ jobFair.longitude }}</a-descriptions-item>
      <a-descriptions-item label="纬度">{{ jobFair.latitude }}</a-descriptions-item>
      <a-descriptions-item label="乘车路线">{{ jobFair.carLine }}</a-descriptions-item>
      <a-descriptions-item label="活动描述">{{ jobFair.jobFariDesc }}</a-descriptions-item>
    </a-descriptions>
    <a-divider orientation="left">其他信息</a-divider>
    <b-upload-file :fileRefId="jobFair.jobfairsID" :readonly="true"></b-upload-file>
  </div>
</template>

<script setup lang="ts">
import {onMounted, reactive} from "vue";
import {getJobFairById} from "@/api/jobUserManager/jobFair";
import dayjs from "dayjs";
import BUploadFile from "@/components/file/uploadFile.vue";

const jobFair = reactive({
  jobfairsID: "",
  name: "",
  zbUnit: "",
  cbUnit: "",
  address: "",
  companyCount: "",
  startTime: "",
  endTime: "",
  userName: "",
  userMrobile: "",
  regionName: "",
  boothCount: "",
  displayCount: "",
  isMake: "",
  longitude: "",
  latitude: "",
  carLine: "",
  jobFariDesc: ""
})

// 加载数据
async function loadData(jobFairId: string) {
  await getJobFairById(jobFairId).then((result) => {
    Object.keys(jobFair).forEach((key) => {
      jobFair[key] = result[key];
    })
  })
}

onMounted(() => {
  const id = history.state.params?.id;
  loadData(id)
})
</script>

<script lang="ts">
export default {
  name: 'JobFairsDetail'
}
</script>

<style scoped>

</style>