This commit is contained in:
2026-06-01 15:05:27 +08:00
parent 777f2e2a7b
commit 14d282b366
9 changed files with 123 additions and 11 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 229 KiB

After

Width:  |  Height:  |  Size: 250 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 286 KiB

After

Width:  |  Height:  |  Size: 280 KiB

View File

@@ -77,8 +77,10 @@
</div> </div>
<!-- 报告包含内容 --> <!-- 报告包含内容 -->
<div class="card mt-3" v-if="featureData.features && featureData.features.length > 0"> <div class="card mt-3" v-if="showReportFeatures">
<ReportFeatures :features="featureData.features" :title-style="{ color: 'var(--van-text-color)' }" /> <ReportFeatures :features="featureData.features || []" :inquire-product="inquireProductEn"
:inquire-feature-data="featureData"
:title-style="{ color: 'var(--van-text-color)' }" />
<div class="mt-3 text-center"> <div class="mt-3 text-center">
<div class="inline-flex items-center px-3 py-1.5 rounded-full border transition-all" <div class="inline-flex items-center px-3 py-1.5 rounded-full border transition-all"
style="background: linear-gradient(135deg, var(--van-theme-primary-light), rgba(255,255,255,0.8)); border-color: var(--van-theme-primary);"> style="background: linear-gradient(135deg, var(--van-theme-primary-light), rgba(255,255,255,0.8)); border-color: var(--van-theme-primary);">
@@ -140,6 +142,10 @@ import BindPhoneOnlyDialog from "@/components/BindPhoneOnlyDialog.vue";
import SectionTitle from "@/components/SectionTitle.vue"; import SectionTitle from "@/components/SectionTitle.vue";
import ReportFeatures from "@/components/ReportFeatures.vue"; import ReportFeatures from "@/components/ReportFeatures.vue";
import { useAppStore } from "@/stores/appStore"; import { useAppStore } from "@/stores/appStore";
import {
isRiskAssessmentProduct,
resolveInquireProductEn,
} from "@/constants/riskAssessmentReportFeatures";
// Props // Props
const props = defineProps({ const props = defineProps({
@@ -215,6 +221,17 @@ const countdown = ref(60);
// 使用传入的featureData或创建响应式引用 // 使用传入的featureData或创建响应式引用
const featureData = computed(() => props.featureData || {}); const featureData = computed(() => props.featureData || {});
const inquireProductEn = computed(() =>
resolveInquireProductEn(props.feature, featureData.value)
);
const showReportFeatures = computed(() => {
if (isRiskAssessmentProduct(inquireProductEn.value)) {
return true;
}
return !!(featureData.value.features && featureData.value.features.length > 0);
});
// 表单数据 // 表单数据
const formData = reactive({ const formData = reactive({
name: "", name: "",

View File

@@ -143,8 +143,8 @@ const productTypeToDirMap = {
const qrCodePositions = { const qrCodePositions = {
// 风险评估 // 风险评估
riskassessment: [ riskassessment: [
{ x: 602, y: 1000, size: 680 }, // riskassessment_01.jpg { x: 310, y: 505, size: 325 }, // riskassessment_01.jpg
{ x: 602, y: 570, size: 680 }, // riskassessment_02.jpg { x: 310, y: 290, size: 325 }, // riskassessment_02.jpg
{ x: 602, y: 670, size: 680 }, // riskassessment_03.jpg { x: 602, y: 670, size: 680 }, // riskassessment_03.jpg
{ x: 602, y: 1150, size: 680 }, // riskassessment_04.jpg { x: 602, y: 1150, size: 680 }, // riskassessment_04.jpg
], ],

View File

@@ -1,5 +1,5 @@
<template> <template>
<div v-if="features && features.length > 0" :class="containerClass"> <div v-if="displayFeatures.length > 0" :class="containerClass">
<div class="mb-3 text-base font-semibold flex items-center" :style="titleStyle"> <div class="mb-3 text-base font-semibold flex items-center" :style="titleStyle">
<div class="w-1 h-5 rounded-full mr-2" <div class="w-1 h-5 rounded-full mr-2"
style="background: linear-gradient(to bottom, var(--van-theme-primary), var(--van-theme-primary-dark));"> style="background: linear-gradient(to bottom, var(--van-theme-primary), var(--van-theme-primary-dark));">
@@ -7,9 +7,27 @@
报告包含内容 报告包含内容
</div> </div>
<div class="grid grid-cols-4 gap-2"> <div class="grid grid-cols-4 gap-2">
<template v-for="(feature, index) in features" :key="feature.id"> <template v-for="(feature, index) in displayFeatures" :key="feature.id">
<!-- 个人风险评估报告固定展示模块 -->
<template v-if="feature.api_id === 'RISKASSESSMENT_REPORT'">
<div v-for="(module, moduleIndex) in riskAssessmentReportModules"
:key="`${feature.id}-${moduleIndex}`"
class="aspect-square rounded-xl text-center text-sm text-gray-700 font-medium flex flex-col items-center justify-center p-2"
:class="getCardClass(moduleIndex)">
<div class="mb-1">
<img :src="`/inquire_icons/${module.icon}`" :alt="module.name"
class="w-6 h-6 mx-auto"
@error="handleIconError" />
</div>
<div class="text-xs leading-tight font-medium"
style="word-break: break-all; line-height: 1.1; min-height: 28px; display: flex; align-items: center; justify-content: center;">
{{ module.name }}
</div>
</div>
</template>
<!-- FLXG0V4B 特殊处理显示8个独立的案件类型 --> <!-- FLXG0V4B 特殊处理显示8个独立的案件类型 -->
<template v-if="feature.api_id === 'FLXG0V4B'"> <template v-else-if="feature.api_id === 'FLXG0V4B'">
<div v-for="(caseType, caseIndex) in [ <div v-for="(caseType, caseIndex) in [
{ name: '管辖案件', icon: 'beijianguanrenyuan.svg' }, { name: '管辖案件', icon: 'beijianguanrenyuan.svg' },
{ name: '刑事案件', icon: 'xingshi.svg' }, { name: '刑事案件', icon: 'xingshi.svg' },
@@ -181,12 +199,29 @@
</template> </template>
<script setup> <script setup>
import { computed } from 'vue';
import {
isRiskAssessmentProduct,
resolveInquireProductEn,
riskAssessmentReportModules,
} from '@/constants/riskAssessmentReportFeatures';
// Props // Props
const props = defineProps({ const props = defineProps({
features: { features: {
type: Array, type: Array,
default: () => [] default: () => []
}, },
/** 查询/推广产品标识(路由 feature 或推广链接 product_en */
inquireProduct: {
type: String,
default: ''
},
/** 推广查询等场景下的完整产品数据,用于 fallback product_en */
inquireFeatureData: {
type: Object,
default: () => ({})
},
containerClass: { containerClass: {
type: String, type: String,
default: '' default: ''
@@ -197,6 +232,17 @@ const props = defineProps({
} }
}); });
const resolvedProductEn = computed(() =>
resolveInquireProductEn(props.inquireProduct, props.inquireFeatureData)
);
const displayFeatures = computed(() => {
if (isRiskAssessmentProduct(resolvedProductEn.value)) {
return [{ id: 'riskassessment-report', api_id: 'RISKASSESSMENT_REPORT', name: '' }];
}
return props.features || [];
});
// 获取功能图标 // 获取功能图标
const getFeatureIcon = (apiId) => { const getFeatureIcon = (apiId) => {
const iconMap = { const iconMap = {

View File

@@ -0,0 +1,30 @@
/** 个人大数据 / 风险评估产品英文标识 */
export const RISK_ASSESSMENT_PRODUCT_EN = 'riskassessment';
/** 查询页、推广查询页固定展示的「报告包含内容」 */
export const riskAssessmentReportModules = [
{ name: '综合评分', icon: 'huankuanyali.svg' },
{ name: '数据分析', icon: 'fengxianxingwei.svg' },
{ name: '申请次数', icon: 'jiedaishenqing.svg' },
{ name: '申请机构', icon: 'renqiguanxi.svg' },
{ name: '行为分析', icon: 'jiedaixingwei.svg' },
{ name: '风险汇总', icon: 'yuepeichang.svg' },
{ name: '违约逾期', icon: 'jiedaiweiyue.svg' },
{ name: '特殊名单', icon: 'beijianguanrenyuan.svg' },
{ name: '个人涉诉', icon: 'sifasheyu.svg' },
{ name: '失信公告', icon: 'shixinren.svg' },
{ name: '限高公告', icon: 'xianzhigaoxiaofei.svg' },
{ name: '裁判公告', icon: 'minshianjianguanli.svg' },
{ name: '开庭公告', icon: 'xingshi.svg' },
{ name: '执行公告', icon: 'zhixinganjian.svg' },
];
export function isRiskAssessmentProduct(productEn) {
return productEn === RISK_ASSESSMENT_PRODUCT_EN;
}
/** 代理查询用 feature 路由参数;推广查询用 link 接口返回的 product_en */
export function resolveInquireProductEn(feature, featureData) {
const fromData = featureData && typeof featureData === 'object' ? featureData.product_en : '';
return feature || fromData || '';
}

BIN
src/ui/UI组件.zip Normal file

Binary file not shown.

View File

@@ -66,8 +66,9 @@
</div> </div>
<!-- 报告信息卡片 --> <!-- 报告信息卡片 -->
<div v-if="featureData.product_name" class="card mb-4"> <div v-if="showPromoteReportFeatures" class="card mb-4">
<ReportFeatures :features="featureData.features" /> <ReportFeatures :features="featureData.features" :inquire-product="promoteInquireProductEn"
:inquire-feature-data="featureData" />
</div> </div>
<!-- 报告类型选择弹窗 --> <!-- 报告类型选择弹窗 -->
@@ -89,6 +90,10 @@ import { useRoute, useRouter } from 'vue-router';
import PriceInputPopup from '@/components/PriceInputPopup.vue'; import PriceInputPopup from '@/components/PriceInputPopup.vue';
import ReportFeatures from '@/components/ReportFeatures.vue'; import ReportFeatures from '@/components/ReportFeatures.vue';
import { getProductConfig, generateLink } from '@/api/agent'; import { getProductConfig, generateLink } from '@/api/agent';
import {
isRiskAssessmentProduct,
resolveInquireProductEn,
} from '@/constants/riskAssessmentReportFeatures';
// 导入logo图片 // 导入logo图片
import personalDataLogo from '@/assets/images/promote/personal_data_logo.png'; import personalDataLogo from '@/assets/images/promote/personal_data_logo.png';
@@ -118,6 +123,16 @@ const productConfig = ref(null);
const fullLink = ref(""); // 完整的推广短链 const fullLink = ref(""); // 完整的推广短链
const featureData = ref({}); const featureData = ref({});
const promoteInquireProductEn = computed(() =>
resolveInquireProductEn(currentFeature.value, featureData.value)
);
const showPromoteReportFeatures = computed(() => {
if (!featureData.value.product_name) return false;
if (isRiskAssessmentProduct(promoteInquireProductEn.value)) return true;
return !!(featureData.value.features && featureData.value.features.length > 0);
});
// Logo映射 // Logo映射
const logoMap = { const logoMap = {
'riskassessment': personalDataLogo, 'riskassessment': personalDataLogo,

View File

@@ -1,5 +1,5 @@
<script setup> <script setup>
import { ref, onMounted, onBeforeMount } from "vue"; import { ref, computed, onMounted, onBeforeMount } from "vue";
import { useRoute } from "vue-router"; import { useRoute } from "vue-router";
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import { useUserStore } from '@/stores/userStore'; import { useUserStore } from '@/stores/userStore';
@@ -15,6 +15,9 @@ const linkIdentifier = ref("");
const feature = ref(""); const feature = ref("");
const featureData = ref({}); const featureData = ref({});
/** 推广链接加载后 product_en 与 feature 同步,供 InquireForm 识别 riskassessment 等 */
const inquireFeature = computed(() => feature.value || featureData.value.product_en || "");
onBeforeMount(async () => { onBeforeMount(async () => {
await getProduct(); await getProduct();
}); });
@@ -63,6 +66,7 @@ async function getProduct() {
</script> </script>
<template> <template>
<InquireForm :type="'promotion'" :feature="feature" :link-identifier="linkIdentifier" :feature-data="featureData" /> <InquireForm :type="'promotion'" :feature="inquireFeature" :link-identifier="linkIdentifier"
:feature-data="featureData" />
<WechatOverlay /> <WechatOverlay />
</template> </template>