first commit

src/ui/DWBG7F3A/components/FraudRiskSection.vue

@@ -0,0 +1,73 @@
+<template>
+  <div class="card">
+    <div class="rounded-lg border border-gray-200 pb-2 mb-4">
+      <div class="flex items-center mb-4 p-4">
+        <div class="w-8 h-8 flex items-center justify-center mr-2">
+          <img src="@/assets/images/report/zfx.png" alt="可疑欺诈风险" class="w-8 h-8 object-contain" />
+        </div>
+        <span class="font-bold text-gray-800">可疑欺诈风险</span>
+      </div>
+      <div class="mt-4">
+        <!-- 风险概览 -->
+        <div class="mb-6">
+          <LTitle title="风险概览" />
+          <div class="grid grid-cols-2 gap-4 p-4">
+            <div class="bg-blue-50 rounded-lg p-4 text-center border border-[#2B79EE8F]">
+              <div class="text-2xl font-bold" :class="getRiskLevelClass(data.riskLevel1)">
+                {{ formatRiskLevel(data.riskLevel1) }}
+              </div>
+              <div class="text-sm text-gray-600 mt-1">疑似准入风险V1</div>
+            </div>
+            <div class="bg-blue-50 rounded-lg p-4 text-center border border-[#2B79EE8F]">
+              <div class="text-2xl font-bold" :class="getRiskLevelClass(data.riskLevel2)">
+                {{ formatRiskLevel(data.riskLevel2) }}
+              </div>
+              <div class="text-sm text-gray-600 mt-1">疑似准入风险V2</div>
+            </div>
+          </div>
+        </div>
+
+        <!-- 说明 -->
+        <div class="p-4">
+          <div class="text-xs text-gray-500">
+            <div>风险等级：1=低风险、2=中风险、3=高风险</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import LTitle from '@/components/LTitle.vue'
+
+const props = defineProps({
+  data: {
+    type: Object,
+    default: () => ({})
+  }
+})
+
+const formatRiskLevel = (level) => {
+  if (level === undefined || level === null) return '-'
+  const levelMap = {
+    1: '低风险',
+    2: '中风险',
+    3: '高风险'
+  }
+  return levelMap[level] || level
+}
+
+const getRiskLevelClass = (level) => {
+  if (level === undefined || level === null) return 'text-gray-400'
+  if (level === 3) return 'text-red-600'
+  if (level === 2) return 'text-orange-500'
+  return 'text-[#1FBE5D]'
+}
+</script>
+
+<style scoped>
+.card {
+  background: #ffffff;
+}
+</style>