133 lines
3.1 KiB
Vue
133 lines
3.1 KiB
Vue
<template>
|
|
<view class="flex flex-col h-screen relative custom-bg">
|
|
<Navbar safeAreaInsetTop :bordered="false" leftArrow @clickLeft="handleBack" bg-color="transparent">
|
|
<template #title>
|
|
<text class="text-[#1F2329] text-[36rpx] font-medium text-[#fff]">能力测评报告</text>
|
|
</template>
|
|
</Navbar>
|
|
|
|
<view class="flex-1 overflow-auto relative mt-[40rpx] flex flex-col">
|
|
<view class="flex flex-col flex-1 overflow-auto pb-[20rpx]">
|
|
<!-- 顶部卡片 -->
|
|
<view class="flex flex-col pt-[32rpx] mx-[24rpx] bg-[#fff] px-[30rpx] pt-[30rpx] border-class">
|
|
<text class="text-[#333] text-[28rpx] mb-[14rpx] z-2 font-700">你的弱势能力为</text>
|
|
<text class="text-[#117CFC] text-[36rpx] z-2">
|
|
{{ studyRecord.title.replace('你的弱势能力：', '') }}
|
|
</text>
|
|
</view>
|
|
<!-- 雷达图占位 -->
|
|
<LineReport :echart-data="studyRecord.linChart" :description="studyRecord.description" />
|
|
<AbilityDimension :report-items="studyRecord.reportItems" />
|
|
</view>
|
|
<!-- 底部AI智能顾问 -->
|
|
<AiFooter :pageId="pageId" :pageType="pageType" />
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<script setup lang="ts">
|
|
import Navbar from '@/chart-sub/components/navbar/Navbar.vue'
|
|
import LineReport from '../components/interestChart/LineReport.vue'
|
|
import AbilityDimension from '../components/AbilityDimension.vue'
|
|
import AiFooter from '../components/AiFooter.vue'
|
|
import { handleBack } from '../hooks/useEvaluateBack'
|
|
|
|
import { getAbilityDimension } from '@/service'
|
|
|
|
|
|
// #ifdef MP-WEIXIN
|
|
definePage({
|
|
style: {
|
|
navigationStyle: 'custom',
|
|
},
|
|
excludeLoginPath: false,
|
|
})
|
|
// #endif
|
|
|
|
// #ifndef MP-WEIXIN
|
|
definePage({
|
|
style: {
|
|
navigationStyle: 'custom',
|
|
transparentTitle: 'always',
|
|
navigationBarTitleText: ''
|
|
},
|
|
excludeLoginPath: false,
|
|
})
|
|
// #endif
|
|
|
|
const pageType = ref(0)
|
|
const pageId = ref(0)
|
|
|
|
const studyRecord = ref({
|
|
description: '',
|
|
title: '',
|
|
linChart: [],
|
|
reportItems: [],
|
|
hTag: '',
|
|
})
|
|
|
|
onLoad((options) => {
|
|
pageType.value = +options.type
|
|
pageId.value = options.id
|
|
|
|
getAbilityDimension({ ScaleId: pageId.value }).then((resp) => {
|
|
if (resp.code === 200) {
|
|
studyRecord.value = resp.result as {
|
|
description: string
|
|
title: string
|
|
linChart: any[]
|
|
reportItems: any[]
|
|
hTag: string
|
|
}
|
|
}
|
|
})
|
|
})
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.custom-bg {
|
|
background: linear-gradient(184deg, #0d79fc 0%, #2186fc 100%);
|
|
}
|
|
|
|
:deep(.icon-class) {
|
|
color: #fff !important;
|
|
}
|
|
|
|
.header-bg {
|
|
width: calc(100% - 80rpx);
|
|
height: 244rpx;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 40rpx;
|
|
z-index: 1;
|
|
}
|
|
|
|
.type-tag {
|
|
font-size: 24rpx;
|
|
min-width: 40rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
.position-tag {
|
|
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
|
|
font-size: 26rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
.table-row {
|
|
align-items: center;
|
|
font-size: 26rpx;
|
|
color: #333;
|
|
}
|
|
|
|
.avatar-item image {
|
|
border: 4rpx solid #fff;
|
|
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.15);
|
|
}
|
|
|
|
.border-class {
|
|
border-radius: 20rpx 20rpx 0 0;
|
|
padding-bottom: 42rpx;
|
|
margin-bottom: -14rpx;
|
|
}
|
|
</style>
|