<template>
  <div>
    <div class="basic-details-title border-none">
      <span class="border-span">周转车信息</span>
    </div>
    <el-descriptions
      :label-style="labelStyle"
      :contentStyle="contentStyle"
      title=""
      :column="3"
      size="medium"
      border
    >
      <el-descriptions-item>
        <template slot="label">长</template>
        {{
          categoryVehicle.vehicleLen ? categoryVehicle.vehicleLen + 'mm' : null
        }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">宽</template>
        {{ categoryVehicle.wilde ? categoryVehicle.wilde + 'mm' : null }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">高</template>
        {{ categoryVehicle.hight ? categoryVehicle.hight + 'mm' : null }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">层数</template>
        {{ categoryVehicle.levelNum }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">材质</template>
        {{ categoryVehicle.materialQuality }}
      </el-descriptions-item>
    </el-descriptions>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        labelStyle: {
          width: '200px'
        },
        contentStyle: {
          width: '400px'
        },
        categoryVehicle: {}
      };
    },
    methods: {
      async getDetailInfoAugr(data) {
        this.categoryVehicle = { ...data };
      }
    }
  };
</script>

<style lang="scss" scoped>
  .upload-container {
    display: flex;
    justify-content: flex-start;
    .file-list {
      margin-left: 50px;
      flex: 1;
    }
  }
  .basic-details-title {
    font-size: 16px;
    margin: 15px 0;
  }
</style>
