5 changed files with 244 additions and 2 deletions
@ -0,0 +1,188 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2024-09-12 16:32:43 |
||||
|
@ 备注: 九型人格测试结果 |
||||
|
--> |
||||
|
<script lang='ts' setup> |
||||
|
import * as echarts from 'echarts'; |
||||
|
import { nineResultToken } from '@/api/hr/people'; |
||||
|
const props = defineProps({ |
||||
|
tabsid: { |
||||
|
type: String, |
||||
|
default: "1", |
||||
|
}, |
||||
|
usercont:{ |
||||
|
type:Object, |
||||
|
default(){ |
||||
|
return {} |
||||
|
} |
||||
|
} |
||||
|
}); |
||||
|
|
||||
|
|
||||
|
const nineTestPageLoading = ref(false) |
||||
|
const nineTestPage = ref<any>(null) |
||||
|
const disTitlePick = ref<string[]>([]) |
||||
|
const discdrawRadar = ref(null) |
||||
|
//页面加载前先获取测试数据 |
||||
|
onBeforeMount(()=>{ |
||||
|
let sendData = { |
||||
|
id:props.usercont.number.toString() |
||||
|
} |
||||
|
nineResultToken(sendData) |
||||
|
.then(({data}) => { |
||||
|
// console.log("获取我的111111请求", data); |
||||
|
disTitlePick.value = data.ColourNameList |
||||
|
drawNineRadarChart(data.colourTitle,data.RadarColour,data.indicator) |
||||
|
}) |
||||
|
}); |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2024-08-30 13:37:05 |
||||
|
@ 功能: 绘图 |
||||
|
*/ |
||||
|
const drawNineRadarChart = (radarTitle:string[],radarVal:number[],indicator:any[]) => { |
||||
|
console.log("drawNineRadarChart",indicator) |
||||
|
let option = { |
||||
|
radar: { |
||||
|
indicator: indicator |
||||
|
}, |
||||
|
series: [ |
||||
|
{ |
||||
|
name: '', |
||||
|
type: 'radar', |
||||
|
data: [ |
||||
|
{ |
||||
|
// value: [20, 8, 15, 5, 6], |
||||
|
value: radarVal, |
||||
|
name: '性格测试诶结果', |
||||
|
label: { |
||||
|
show: true, |
||||
|
formatter: function (params) { |
||||
|
return params.value; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
], |
||||
|
itemStyle: { |
||||
|
normal: { |
||||
|
color: "#1DBB37" |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
] |
||||
|
}; |
||||
|
if(discdrawRadar.value){ |
||||
|
discdrawRadar.value.clear(); |
||||
|
discdrawRadar.value.setOption(option) |
||||
|
} |
||||
|
} |
||||
|
//所有组件加载完后执行 |
||||
|
onMounted(()=>{ |
||||
|
nextTick(()=>{ |
||||
|
discdrawRadar.value = markRaw(echarts.init(nineTestPage.value)) |
||||
|
}) |
||||
|
}) |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2024-06-12 14:27:32 |
||||
|
@ 功能: 判断该颜色是否存在了 |
||||
|
*/ |
||||
|
const judgaDiscNine = (val:string) => { |
||||
|
let isTyue = false; |
||||
|
if(disTitlePick.value && disTitlePick.value.length > 0){ |
||||
|
disTitlePick.value.forEach((item:string)=>{ |
||||
|
if(val == item) { |
||||
|
isTyue = true; |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
return isTyue |
||||
|
} |
||||
|
</script> |
||||
|
<template> |
||||
|
<div> |
||||
|
<div ref="nineTestPage" v-loading="nineTestPageLoading" element-loading-text="Loading..." class="allOrgAxisCares"> |
||||
|
|
||||
|
</div> |
||||
|
<el-text class="mx-1 title_size">九型性格解析</el-text> |
||||
|
<el-row> |
||||
|
<el-col :span="24"> |
||||
|
<div v-if="judgaDiscNine('RI')"> |
||||
|
<el-text class="mx-1 hongSe" type="info">资源调查员:<br></el-text> |
||||
|
<el-text class="mx-1" type="info">强项:外向、热情、善沟通、善于发掘机会,善于与他人建立联系<br></el-text> |
||||
|
<el-text class="mx-1" type="info">允许的弱项:过于乐观;虎头蛇尾</el-text> |
||||
|
</div> |
||||
|
<div v-if="judgaDiscNine('IM')"> |
||||
|
<el-text class="mx-1 hongSe" type="info">实干家:<br></el-text> |
||||
|
<el-text class="mx-1" type="info">强项:遵守纪律、可靠、稳健、高效、能够把想法付诸实际行动<br></el-text> |
||||
|
<el-text class="mx-1" type="info">允许的弱项:缺乏灵活性,对新的想法反应迟钝</el-text> |
||||
|
</div> |
||||
|
<div v-if="judgaDiscNine('CO')"> |
||||
|
<el-text class="mx-1 hongSe" type="info">协调员:<br></el-text> |
||||
|
<el-text class="mx-1" type="info">强项:成熟、自信、合适的团队领导人,能够澄清目标,推动决策的过程,姜于授权<br></el-text> |
||||
|
<el-text class="mx-1" type="info">允许的弱项:喜欢操纵和摆布,把自己的工作分配给其他人去干</el-text> |
||||
|
</div> |
||||
|
<div v-if="judgaDiscNine('PL')"> |
||||
|
<el-text class="mx-1 hongSe" type="info">智多星:<br></el-text> |
||||
|
<el-text class="mx-1" type="info">强项:具有创造力和想象力,能够创新,并且解决难题<br></el-text> |
||||
|
<el-text class="mx-1" type="info">允许的弱项:对细节不够重视,过于专注手头的工作,无法有效沟通</el-text> |
||||
|
</div> |
||||
|
<div v-if="judgaDiscNine('SH')"> |
||||
|
<el-text class="mx-1 hongSe" type="info">鞭策者:<br></el-text> |
||||
|
<el-text class="mx-1" type="info">强项:富于挑战精神、充满活力、敢于面对压力并能取得好成绩,不畏惧艰险,不屈不挠<br></el-text> |
||||
|
<el-text class="mx-1" type="info">允许的弱项:容易激怒别人容忍性差,常会伤害别人</el-text> |
||||
|
</div> |
||||
|
<div v-if="judgaDiscNine('ME')"> |
||||
|
<el-text class="mx-1 hongSe" type="info">监督评论员:<br></el-text> |
||||
|
<el-text class="mx-1" type="info">强项:审慎、能从战略高度出发,具有洞察力,能通盘考虑所有人的观点,准确判断<br></el-text> |
||||
|
<el-text class="mx-1" type="info">允许的弱项:缺乏推动和启发他人的能力过于挑剔</el-text> |
||||
|
</div> |
||||
|
<div v-if="judgaDiscNine('TW')"> |
||||
|
<el-text class="mx-1 hongSe" type="info">凝聚者:<br></el-text> |
||||
|
<el-text class="mx-1" type="info">强项:乐于合作,温和友善能够理解别人,善于倾听,交往,尽量避免摩擦,息事宁人<br></el-text> |
||||
|
<el-text class="mx-1" type="info">允许的弱项:关键时刻犹豫不决,容易受到别人的影响</el-text> |
||||
|
</div> |
||||
|
<div v-if="judgaDiscNine('CF')"> |
||||
|
<el-text class="mx-1 hongSe" type="info">善始善终者:<br></el-text> |
||||
|
<el-text class="mx-1" type="info">强项:兢兢业业、认真负责急切、能够找出错误和遗漏,能够按时完成工作<br></el-text> |
||||
|
<el-text class="mx-1" type="info">允许的弱项:过于不安和担忧,不愿意授权、吹毛求疵</el-text> |
||||
|
</div> |
||||
|
<div v-if="judgaDiscNine('CP')"> |
||||
|
<el-text class="mx-1 hongSe" type="info">技术专家:<br></el-text> |
||||
|
<el-text class="mx-1" type="info">强项:-心一意、自我激励、全心全意提供专门领域的知识和技能。<br></el-text> |
||||
|
<el-text class="mx-1" type="info">允许的弱项:只能在狭窄的领域做出贡献,拘泥于技术细节而忽视了整体情况。</el-text> |
||||
|
</div> |
||||
|
<div v-if="judgaDiscNine('DR')"> |
||||
|
<el-text class="mx-1 hongSe" type="info">DR<br></el-text> |
||||
|
</div> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
</div> |
||||
|
</template> |
||||
|
<style lang='scss' scoped> |
||||
|
.allOrgAxisCares{ |
||||
|
display: block; |
||||
|
width: 100%; |
||||
|
height:380px; |
||||
|
// overflow:auto; |
||||
|
} |
||||
|
.hongSe{ |
||||
|
color: #FF0000; |
||||
|
} |
||||
|
.lanSe{ |
||||
|
color: #0000FF; |
||||
|
} |
||||
|
.huangSe{ |
||||
|
color: #FFD700; |
||||
|
} |
||||
|
.lvSe{ |
||||
|
color: #008000; |
||||
|
} |
||||
|
.title_size{ |
||||
|
font-size:24px; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue