cyzh-park/src/components/dialog/comps/visitor-detail.vue

<template>
  <div>
    <div class="contain-main" style="padding-top: 10px;">
     <div class="content" >
       <div class="face" style="padding-bottom:4%;" v-if="detail.faceUrl">
         <el-image style="width: 100px;height: 100px;" :src="detail.faceUrl" :preview-src-list="[detail.faceUrl]" z-index="999999"></el-image>
       </div>
        <label>人员姓名：{{detail.userName}}</label>
        <label v-if="detail.temperature">体温检测：{{detail.temperature}} ℃</label>
        <label v-if="detail.openType==1">开门方式：刷脸开门</label>
        <label v-if="detail.openType==2">开门方式：小程序一键开门</label>
        <label v-if="detail.openTime">开门时间：{{detail.openTime}}</label>
        <label v-else>抓怕时间：{{detail.createTime}}</label>
        <label v-if="detail.score">抓拍分数：{{detail.score}}分</label>
        <label>所在园区：{{detail.agencyName}}</label>
        <label>所在区域：{{detail.residentialName}}</label>
        <label>所在企业：{{detail.enterpriseName}}</label>
        <label>设备名称：{{detail.deviceName}}</label>
        <label>设备地址：{{detail.deviceAddress}}</label>
      </div>

    </div>
  </div>
</template>

<script>
  export default {
    props: {
      detail: Object
    },
    data() {
      return {

      };
    },
    created() {
      console.log(this.detail);
    }
  };
</script>

<style lang="scss" scoped>
  .contain-main {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 1%;
    flex-direction: column;
    color: #ebebeb;
    padding-bottom: 0.625rem;
  }

  .content {
    display: flex;
    flex-direction: column;

    label {
      margin-bottom: 2.2%;
    }
  }
</style>