integrated_traffic_vue/src/views/mechanical_files/scrap_manage/view.vue

<template>
  <layout-card>
    <div id="printContainer">
      <el-divider content-position="left">详情</el-divider>
      <el-descriptions border>
        <el-descriptions-item label="车牌号">
          {{ data.PLATE_NUMBER }}
        </el-descriptions-item>
        <el-descriptions-item label="车架号">
          {{ data.FRAMES_NUMBER }}
        </el-descriptions-item>
        <el-descriptions-item label="车主业主">
          {{ data.VEHICLEOWNER }}
        </el-descriptions-item>
        <el-descriptions-item label="车主电话">
          {{ data.VEHICLEOWNER_NUMBER }}
        </el-descriptions-item>
        <!--      <el-descriptions-item label="发动机号">
        {{ data.ENGINE_NUMBER }}
      </el-descriptions-item>-->
        <el-descriptions-item label="初登日期">
          {{ data.FIRSTSHOW_DATE }}
        </el-descriptions-item>
        <el-descriptions-item label="车辆品牌">
          {{ data.BRAND }}
        </el-descriptions-item>
        <el-descriptions-item label="车辆型号">
          {{ data.VEHICLE_MODEL }}
        </el-descriptions-item>
        <!--      <el-descriptions-item label="动力类型">
        {{ data.POWER_TYPE }}
      </el-descriptions-item>
      <el-descriptions-item label="排放标准">
        {{ data.EMISSION_STANDARD }}
      </el-descriptions-item>-->
      </el-descriptions>
      <el-divider content-position="left">报废数据</el-divider>
      <el-descriptions border>
        <el-descriptions-item label="登记编号">
          {{ data.RECORD_NUMBER }}
        </el-descriptions-item>
        <el-descriptions-item label="办理日期">
          {{ data.SCRAP_DATE }}
        </el-descriptions-item>
        <el-descriptions-item label="登记人">
          {{ data.REGISTRANT }}
        </el-descriptions-item>
      </el-descriptions>
      <el-descriptions :column="1" border>
        <el-descriptions-item label="报废资料">
          {{ data.SCRAP_MATERIAL }}
        </el-descriptions-item>
      </el-descriptions>
      <el-descriptions :column="1" border>
        <el-descriptions-item label="备注">
          {{ data.REMARK }}
        </el-descriptions-item>
      </el-descriptions>
    </div>
    <div class="mt-10 tc">
      <el-button v-print="'#printContainer'" type="primary">打印</el-button>
    </div>
    <div v-html="PRINT_STYLE" />
  </layout-card>
</template>

<script setup>
import { findByIdScrapManageInfo } from "@/request/scrap_manage.js";
import { useRoute } from "vue-router";
import { ref } from "vue";
import { PRINT_STYLE } from "@/assets/js/constant.js";
const route = useRoute();
const { SCRAP_ID } = route.query;
const data = ref({});
const getData = async () => {
  const { pd } = await findByIdScrapManageInfo({ SCRAP_ID });
  data.value = pd;
};
getData();
</script>

<style scoped></style>