53 lines
2.5 KiB
Vue
53 lines
2.5 KiB
Vue
<script setup>
|
|
import { computed } from 'vue'
|
|
import { useRiskNotifier } from '@/composables/useRiskNotifier'
|
|
import { useVehiclePayload } from '@/composables/useVehiclePayload'
|
|
import { payloadAsArray } from '@/utils/vehiclePayload'
|
|
|
|
const props = defineProps({
|
|
data: { default: null },
|
|
params: Object,
|
|
apiId: { type: String, default: '' },
|
|
index: { type: Number, default: 0 },
|
|
notifyRiskStatus: { type: Function, default: () => {} },
|
|
})
|
|
|
|
const records = computed(() => payloadAsArray(props.data))
|
|
|
|
const riskScore = computed(() => 100)
|
|
useRiskNotifier(props, riskScore)
|
|
</script>
|
|
|
|
<template>
|
|
<div class="card space-y-3">
|
|
<div class="bg-gradient-to-br from-blue-50 to-indigo-50 rounded-lg p-4 border border-blue-100">
|
|
<h3 class="text-lg font-bold text-gray-900">车辆静态信息查询</h3>
|
|
<p class="text-sm text-gray-600 mt-1">生产、排放、燃料等静态信息</p>
|
|
</div>
|
|
|
|
<template v-if="records.length">
|
|
<div
|
|
v-for="(item, idx) in records"
|
|
:key="idx"
|
|
class="bg-gray-50 rounded-lg p-4 border border-gray-200"
|
|
>
|
|
<div class="flex flex-wrap items-center gap-2 mb-3">
|
|
<span class="text-xs text-blue-700 bg-blue-50 px-2 py-0.5 rounded">车辆 {{ idx + 1 }}</span>
|
|
<span class="font-semibold text-gray-900">{{ item.vType || '未知车型' }}</span>
|
|
<span class="text-xs text-blue-600 bg-white px-2 py-0.5 rounded-full border">{{ item.vFuelType || '燃料未知' }}</span>
|
|
</div>
|
|
<div class="grid grid-cols-2 gap-3 text-sm">
|
|
<div><span class="text-gray-500 block text-xs">发动机号</span><span class="font-mono">{{ item.engineNO || '-' }}</span></div>
|
|
<div><span class="text-gray-500 block text-xs">发动机型号</span><span class="font-mono">{{ item.engineType || '-' }}</span></div>
|
|
<div><span class="text-gray-500 block text-xs">生产日期</span>{{ item.vScdate || '-' }}</div>
|
|
<div><span class="text-gray-500 block text-xs">排放阶段</span>{{ item.dischargeStage || '-' }}</div>
|
|
<div><span class="text-gray-500 block text-xs">车辆分类</span>{{ item.vClassification || '-' }}</div>
|
|
<div class="col-span-2"><span class="text-gray-500 block text-xs">生产企业</span>{{ item.vManufacturer || '-' }}</div>
|
|
<div class="col-span-2"><span class="text-gray-500 block text-xs">生产厂地址</span>{{ item.vSccdz || '-' }}</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<div v-else class="text-center py-10 text-gray-500">暂无车辆静态信息</div>
|
|
</div>
|
|
</template>
|