1141 lines
50 KiB
Vue
1141 lines
50 KiB
Vue
<template>
|
||
<view class="interest-report-wrap">
|
||
<view class="content">
|
||
<contrastBox :testType="testType" :userId="userId" :recordId="recordId" @compareParameters="opCompareParameters"></contrastBox>
|
||
<view class="section-block">
|
||
<testHead :reportTitle="'人格测评报告'" :testTime="testDate" :isIntroduce="false" :isVideo="true" :videoUrl="videoUrl" :introduceUrl="introduceUrl" ></testHead>
|
||
<view class="s-line"></view>
|
||
<view class="title">
|
||
<view class="name">强项特质</view>
|
||
</view>
|
||
<view class="text-desc-wrap" v-if="!isNoHight">
|
||
<view class="row" v-if="scoreDetail[0].Leavel >= 4">
|
||
在群体中充满能量和快乐，<text class="strong">外向、热情</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[1].Leavel >= 4">
|
||
有说服力和影响力，争做团体中的<text class="strong">领导者</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[2].Leavel >= 4">
|
||
<text class="strong">善于交际</text>，广交朋友，朋友圈庞大
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[3].Leavel >= 4">
|
||
<text class="strong">灵活变通</text>，参考多方意见再做出自己的决定
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[4].Leavel >= 4">
|
||
逆来顺受，<text class="strong">几乎不与人发生冲突</text>，脾气温和
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[5].Leavel >= 4">
|
||
与人为善，沟通能力强，<text class="strong">易于亲近</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[6].Leavel >= 4">
|
||
做事尽职尽责，竭尽全力，未完成前<text class="strong">决不放弃</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[7].Leavel >= 4">
|
||
<text class="strong">严格遵守计划</text>，生活规律有秩序
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[8].Leavel >= 4">
|
||
需要长时间的思考和较多的信息才能做出决策，<text class="strong">犹豫不果断</text></view>
|
||
<view class="row" v-if="scoreDetail[9].Leavel >= 4">
|
||
追求新鲜事物，<text class="strong">愿意接受挑战与冒险</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[10].Leavel >= 4">
|
||
<text class="strong">随机应变</text>，不拘泥规则限制，对生活求新、求变
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[11].Leavel >= 4">
|
||
<text class="strong">情感丰富</text>，同理心强，艺术表现力和感受力较好
|
||
</view>
|
||
</view>
|
||
<view class="text-desc-wrap" v-else>
|
||
<view class="empty-tip">
|
||
无强项特质
|
||
</view>
|
||
</view>
|
||
<view class="title">
|
||
<view class="name">普通特质</view>
|
||
</view>
|
||
<view class="text-desc-wrap" v-if="!isNoMid">
|
||
<view class="row" v-if="scoreDetail[0].Leavel == 3">
|
||
在群体中<text class="strong">收放自如</text>，可以较好的适应
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[1].Leavel == 3">
|
||
具有一定的领导力，但<text class="strong">不会争做团队领头人</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[2].Leavel == 3">
|
||
有自己的朋友圈，在交际中<text class="strong">不会过于热情</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[3].Leavel == 3">
|
||
墨守成规，<text class="strong">做事不够灵活</text>，可以多参考他人建议
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[4].Leavel == 3">个性温和，但遇事敢于挑战权威，<text
|
||
class="strong">不会一味退让</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[5].Leavel == 3">
|
||
与人交往过程中可以<text class="strong">恰当的展现倾听和交流技巧</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[6].Leavel == 3">
|
||
<text class="strong">认真负责</text>，但偶尔会
|
||
<text class="strong">虎头蛇尾</text>，中途放弃
|
||
</view>
|
||
|
||
<view class="row" v-if="scoreDetail[7].Leavel == 3">
|
||
执行计划有一定<text class="strong">弹性</text>
|
||
</view>
|
||
|
||
<view class="row" v-if="scoreDetail[8].Leavel == 3">
|
||
做决定前会谨慎思考，但<text class="strong">不会长时间犹豫不决</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[9].Leavel == 3">
|
||
对新事物充满好奇，<text class="strong">但没有信心与勇气接受新的挑战</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[10].Leavel == 3">
|
||
<text class="strong">稳重</text>，难以突破自己；但面对新变化，<text class="strong">也会迎难而上去接受</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[11].Leavel == 3">
|
||
<text class="strong">感性与理智兼具</text>
|
||
</view>
|
||
</view>
|
||
<view class="text-desc-wrap" v-else>
|
||
<view class="empty-tip">
|
||
无普通特质
|
||
</view>
|
||
</view>
|
||
<view class="title">
|
||
<view class="name">弱项特质</view>
|
||
</view>
|
||
<view class="text-desc-wrap" v-if="!isNoLow">
|
||
<view class="row" v-if="scoreDetail[0].Leavel < 3">
|
||
在群体活动中表现<text class="strong">沉默、孤独</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[1].Leavel < 3">
|
||
不会在团体中争做领导者，<text class="strong">避免在集体中出风头</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[2].Leavel < 3">
|
||
冷漠，<text class="strong">不善交际</text>，朋友圈狭窄
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[3].Leavel < 3">
|
||
<text class="strong">固执已见</text>，拒绝他人介入自己的事情
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[4].Leavel < 3">遇到不满的人和，<text class="strong">事敢于抗争</text>针锋相对
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[5].Leavel < 3">缄默冷淡，<text class="strong">不易亲近</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[6].Leavel < 3">
|
||
不够认真专注，做事<text class="strong">拖延</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[7].Leavel < 3">
|
||
<text class="strong">率性而为</text>，不喜欢按照计划规律生活
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[8].Leavel < 3">
|
||
<text class="strong">做事果断</text>，不需要思考很久就可以行动
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[9].Leavel < 3">
|
||
不愿接受过大改变，<text class="strong">墨守成规</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[10].Leavel < 3">享受平稳、安逸的生活，<text class="strong">不要有过多变化</text>
|
||
</view>
|
||
<view class="row" v-if="scoreDetail[11].Leavel < 3">
|
||
理性、现实，对情绪或情感<text class="strong">较不敏感</text>，难以同理他人
|
||
</view>
|
||
</view>
|
||
<view class="text-desc-wrap" v-else>
|
||
<view class="empty-tip">
|
||
无弱项特质
|
||
</view>
|
||
</view>
|
||
<view class="chat-wrap blue-bg" style="margin-bottom:40rpx;">
|
||
<view class="chat-title">
|
||
综合特质等级侧面图
|
||
</view>
|
||
<view class="row-item"><l-echart ref="charts1" class="charts-box"></l-echart>
|
||
</view>
|
||
</view>
|
||
<view class="chat-tip">
|
||
<text>*强项：等级4-5</text>
|
||
<text>普通：等级3</text>
|
||
<text>弱项：等级1-2</text>
|
||
</view>
|
||
</view>
|
||
<view class="section-block" >
|
||
<view class="title">
|
||
<view class="name">分特质解释说明</view>
|
||
</view>
|
||
<view class="score-item blue">
|
||
<view class="row">
|
||
<text class="name">{{scoreSummary1.Name}}</text>
|
||
<view class="level-label">
|
||
等级： {{scoreSummary1.Leavel}}
|
||
</view>
|
||
<view class="score-label">
|
||
原始分数： {{scoreSummary1.Score}}分
|
||
</view>
|
||
</view>
|
||
<view class="item-desc">{{scoreSummary1.Desc}}</view>
|
||
</view>
|
||
<view class="chat-wrap blue-bg">
|
||
<view class="chat-title">
|
||
内外向综合特质侧面图
|
||
</view>
|
||
<view class="row-item"><l-echart ref="charts2" class="charts-box"></l-echart>
|
||
</view>
|
||
</view>
|
||
<view class="score-item purple">
|
||
<view class="row">
|
||
<text class="name">{{scoreSummary2.Name}}</text>
|
||
<view class="level-label">
|
||
等级： {{scoreSummary2.Leavel}}
|
||
</view>
|
||
<view class="score-label">
|
||
原始分数： {{scoreSummary2.Score}}分
|
||
</view>
|
||
</view>
|
||
<view class="item-desc">{{scoreSummary2.Desc}}</view>
|
||
</view>
|
||
<view class="chat-wrap purple-bg">
|
||
<view class="chat-title">
|
||
人际关系综合特质侧面图
|
||
</view>
|
||
<view class="row-item"><l-echart ref="charts3" class="charts-box"></l-echart>
|
||
</view>
|
||
</view>
|
||
<view class="score-item orange">
|
||
<view class="row">
|
||
<text class="name">{{scoreSummary3.Name}}</text>
|
||
<view class="level-label">
|
||
等级： {{scoreSummary3.Leavel}}
|
||
</view>
|
||
<view class="score-label">
|
||
原始分数： {{scoreSummary3.Score}}分
|
||
</view>
|
||
</view>
|
||
<view class="item-desc">{{scoreSummary3.Desc}}</view>
|
||
</view>
|
||
<view class="chat-wrap orange-bg">
|
||
<view class="chat-title">
|
||
严谨性综合特质侧面图
|
||
</view>
|
||
<view class="row-item"><l-echart ref="charts4" class="charts-box"></l-echart>
|
||
</view>
|
||
</view>
|
||
<view class="score-item green">
|
||
<view class="row">
|
||
<text class="name">{{scoreSummary4.Name}}</text>
|
||
<view class="level-label">
|
||
等级： {{scoreSummary4.Leavel}}
|
||
</view>
|
||
<view class="score-label">
|
||
原始分数： {{scoreSummary4.Score}}分
|
||
</view>
|
||
</view>
|
||
<view class="item-desc">{{scoreSummary4.Desc}}</view>
|
||
</view>
|
||
<view class="chat-wrap green-bg">
|
||
<view class="chat-title">
|
||
开放性综合特质侧面图
|
||
</view>
|
||
<view class="row-item"><l-echart ref="charts5" class="charts-box"></l-echart>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="section-block" >
|
||
<view class="title">
|
||
<view class="name">与你的人格特质可能相关的专业</view>
|
||
</view>
|
||
<view class="job-table">
|
||
<view class="tr">
|
||
<view class="th">特质名称</view>
|
||
<view class="th">专业选择</view>
|
||
</view>
|
||
<view class="tr" v-if="scoreDetail[0].Leavel > 2">
|
||
<view class="td">乐群性</view>
|
||
<view class="td">
|
||
<view class="row">
|
||
<text class="strong">人文科学：</text>新闻传播学
|
||
</view>
|
||
<view class="row">
|
||
<text class="strong">社会科学：</text>教育学、心理学
|
||
</view>
|
||
<view class="row">
|
||
<text class="strong">体育：</text>体育学
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="tr" v-if="scoreDetail[1].Leavel > 2">
|
||
<view class="td">领导性</view>
|
||
<view class="td">
|
||
<view class="row">
|
||
<text class="strong">人文科学：</text>新闻传播学
|
||
</view>
|
||
<view class="row">
|
||
<text class="strong">经济管理：</text>工商管理、公共管理等
|
||
</view>
|
||
<view class="row">
|
||
<text class="strong">社会科学：</text>法学
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="tr" v-if="scoreDetail[2].Leavel > 2">
|
||
<view class="td">社交性</view>
|
||
<view class="td">
|
||
<view class="row">
|
||
<text class="strong">人文科学：</text>新闻传播学
|
||
</view>
|
||
<view class="row">
|
||
<text class="strong">经济管理：</text>工商管理、公共管理旅游管理等
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="tr" v-if="scoreDetail[9].Leavel > 2">
|
||
<view class="td">探究性</view>
|
||
<view class="td">
|
||
<view class="row">
|
||
<text class="strong">数理工程：</text>数学、物理学、统计学、计算机、电子信息、自动化、土木等
|
||
</view>
|
||
<view class="row">
|
||
<text class="strong">化工：</text>化学、纺织、轻工、材料等
|
||
</view>
|
||
<view class="row">
|
||
<text class="strong">农林牧鱼：</text>农业工程、林业工程、林学、自然保护与环境生态等
|
||
</view>
|
||
<view class="row">
|
||
<text class="strong">生物医药：</text>生物科学、基础医学、临床医学、口腔医学、医学药学、护理学等
|
||
</view>
|
||
<view class="row">
|
||
<text class="strong">地理科学：</text>地质、矿业、交通运输、海洋工程、天文等
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="tr" v-if="scoreDetail[10].Leavel > 2">
|
||
<view class="td">变通性</view>
|
||
<view class="td">
|
||
<view class="row">
|
||
<text class="strong">数理工程：</text>土木、建筑等
|
||
</view>
|
||
<view class="row">
|
||
<text class="strong">艺术设计：</text>艺术学理论、美术学、设计学等
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="tr" v-if="scoreDetail[11].Leavel > 2">
|
||
<view class="td">感觉性</view>
|
||
<view class="td">
|
||
<view class="row">
|
||
<text class="strong">数理工程：</text>土木、建筑等
|
||
</view>
|
||
<view class="row">
|
||
<text class="strong">艺术设计：</text>艺术学理论、音乐与舞蹈、戏剧与影视学、美术学、设计学等
|
||
</view>
|
||
<view class="row">
|
||
<text class="strong">人文科学：</text>中国语言文学、外国语言文学、新闻传播等
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="title">
|
||
<view class="name">与你的人格特质可能相关的工作领域</view>
|
||
</view>
|
||
<view class="job-table">
|
||
<view class="tr">
|
||
<view class="th">特质名称</view>
|
||
<view class="th">工作领域</view>
|
||
</view>
|
||
<view class="tr" v-if="scoreDetail[3].Leavel > 2">
|
||
<view class="td">客观性</view>
|
||
<view class="td">顾客服务 市场销售 心理咨询 教育训练</view>
|
||
</view>
|
||
<view class="tr" v-if="scoreDetail[4].Leavel > 2">
|
||
<view class="td">顺从性</view>
|
||
<view class="td">行政管理 会计稽核 军警保安 工程制造</view>
|
||
</view>
|
||
<view class="tr" v-if="scoreDetail[5].Leavel > 2">
|
||
<view class="td">亲和性</view>
|
||
<view class="td">市场销售 教育训练 顾客服务 医护社工</view>
|
||
</view>
|
||
<view class="tr" v-if="scoreDetail[6].Leavel > 2">
|
||
<view class="td">坚毅性</view>
|
||
<view class="td">设计艺术 工程制造 医学治疗 科学研究 军警保安</view>
|
||
</view>
|
||
<view class="tr" v-if="scoreDetail[7].Leavel > 2">
|
||
<view class="td">秩序性</view>
|
||
<view class="td">财务会计 工程制造 医学治疗 科学研究 档案管理</view>
|
||
</view>
|
||
<view class="tr" v-if="scoreDetail[8].Leavel > 2">
|
||
<view class="td">深思性</view>
|
||
<view class="td">文艺写作 科学研究 设计艺术 文史哲学 信息程序</view>
|
||
</view>
|
||
</view>
|
||
<view class="title" @click="showTipLayer(1)">
|
||
<view class="name">作答态度</view>
|
||
<view class="tip-icon"></view>
|
||
</view>
|
||
<view class="score-item blue">
|
||
<view class="row">
|
||
<text class="name">{{scoreSummary5.Name}}</text>
|
||
<view class="level-label">
|
||
{{scoreSummary5.Leavel == 1?'一致性低':'一致性高'}}
|
||
</view>
|
||
<view class="score-label">
|
||
原始分数： {{scoreSummary5.Score}}分
|
||
</view>
|
||
</view>
|
||
<view class="item-desc">{{scoreSummary5.Desc}}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<u-modal :show="showTip" @confirm="showTip=false" @cancel="showTip=false" confirmText="我明白了">
|
||
<view class="slot-content">
|
||
<view class="tip-layer">
|
||
<view class="title">{{layerTitile}}</view>
|
||
<view class="desc" v-html="layerDesc"></view>
|
||
</view>
|
||
</view>
|
||
</u-modal>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import testHead from "@/packageCa/testReport/components/testHead.vue"
|
||
import contrastBox from "@/packageCa/testReport/components/contrastBox.vue"
|
||
import opts from "./chartOpts.js"
|
||
import api from "@/packageCa/apiCa/testManage.js";
|
||
import theme from '@/uni_modules/lime-echart/static/walden.json';
|
||
const echarts = require('../utilCa/echarts.min.js');
|
||
// import * as echarts from '@/uni_modules/lime-echart/static/echarts.min';
|
||
// // 注册主题
|
||
// echarts.registerTheme('theme', theme);
|
||
export default {
|
||
components: {
|
||
contrastBox,
|
||
testHead
|
||
},
|
||
data() {
|
||
return {
|
||
platform: uni.getDeviceInfo().platform,
|
||
barHeight: wx.getWindowInfo().statusBarHeight,
|
||
showTip: false,
|
||
videoUrl: "http://2-video.oss-cn-shenzhen.aliyuncs.com/2023%E5%B9%B4%E8%A7%86%E9%A2%91/%E5%88%9D%E4%B8%AD%E8%AF%BE%E7%A8%8B%E8%B5%84%E6%BA%90/%E4%BA%BA%E6%A0%BC%E6%B5%8B%E8%AF%84%E8%A7%A3%E8%AF%BB1.16%E4%BF%AE%E6%94%B92.mp4",
|
||
introduceUrl: "https://51xuanxiao.oss-cn-hangzhou.aliyuncs.com/Resource/xcx_sygh/report/personalTestReport.png",
|
||
layerTitile: "",
|
||
layerDesc: "",
|
||
scoreSummary1: {},
|
||
scoreSummary2: {},
|
||
scoreSummary3: {},
|
||
scoreSummary4: {},
|
||
scoreSummary5: {},
|
||
scoreDetail: [], //
|
||
isNoHight: false,
|
||
isNoMid: false,
|
||
isNoLow: false,
|
||
scoreSummary: [],
|
||
testDate: "",
|
||
opts, //图表配置
|
||
chartData: {
|
||
categories: ["内外向", "人际关系", "严谨性", "开放性"],
|
||
series: [{
|
||
name: "",
|
||
data: []
|
||
}]
|
||
},
|
||
chartData1: {
|
||
categories: ["乐群性", "领导性", "社交性"],
|
||
series: [{
|
||
name: "",
|
||
data: []
|
||
}]
|
||
},
|
||
chartData2: {
|
||
categories: ["客观性", "顺从性", "亲和性"],
|
||
series: [{
|
||
name: "",
|
||
data: []
|
||
}]
|
||
},
|
||
chartData3: {
|
||
categories: ["坚毅性", "秩序性", "深思性"],
|
||
series: [{
|
||
name: "",
|
||
data: []
|
||
}]
|
||
},
|
||
chartData4: {
|
||
categories: ["探究性", "变通性", "感觉性"],
|
||
series: [{
|
||
name: "",
|
||
data: []
|
||
}]
|
||
},
|
||
opts2: {},
|
||
opts3: {},
|
||
opts4: {},
|
||
|
||
data1: [], //综合特质等级
|
||
data2: [], //内外向综合
|
||
data3: [], //人际关系综合
|
||
data4: [], //严谨性综合
|
||
data5: [], //开放性综合
|
||
option1: {},
|
||
option2: {},
|
||
option3: {},
|
||
option4: {},
|
||
option5: {},
|
||
showContrast: false,
|
||
currentYear: 0,
|
||
currentTerm: 0,
|
||
|
||
testType: "15",
|
||
userId: "",
|
||
platformType: 0,
|
||
recordId: 0,
|
||
labelName1: "",//表值1
|
||
labelName2: "",//表值2
|
||
params: {},//筛选参数
|
||
}
|
||
},
|
||
onLoad(e) {
|
||
if (e.year != null) {
|
||
this.currentYear = e.year;
|
||
}
|
||
if (e.term != null) {
|
||
this.currentTerm = e.term;
|
||
}
|
||
if (e.recordId != null) {
|
||
this.recordId = e.recordId;
|
||
}
|
||
this.getTestRecord(this.currentYear, this.currentTerm,this.recordId);
|
||
},
|
||
methods: {
|
||
//报告介绍
|
||
playIntroduce() {
|
||
this.showIntroduce = true;
|
||
},
|
||
//视频介绍
|
||
playVideo() {
|
||
this.videoUrlVisitor = this.videoUrl;
|
||
this.showVideo = true;
|
||
},
|
||
//对比参数
|
||
opCompareParameters(value){
|
||
this.labelName1 = value.name1;
|
||
this.labelName2 = value.name2;
|
||
this.params = value;
|
||
this.getValue()
|
||
},
|
||
//获取报告结果
|
||
getTestRecord(currentYear, currentTerm,recordId) {
|
||
uni.showLoading({
|
||
title: "加载中"
|
||
})
|
||
api.personalityTestResult(currentYear, currentTerm,recordId).then(res => {
|
||
uni.hideLoading();
|
||
if (res.Result === 1) {
|
||
if (res.Data != null) {
|
||
let info = res.Data.testRecord;
|
||
this.currentYear = info.Year;
|
||
this.currentTerm = info.Term;
|
||
this.recordId = info.Id;
|
||
this.userId = info.UserId;
|
||
this.labelName1 = res.Data.TestDate;
|
||
this.testDate = res.Data.TestDate;
|
||
|
||
let data = JSON.parse(res.Data.testRecord.Suggestion)
|
||
data.ScoreSummary.forEach(item => {
|
||
switch (item.Type) {
|
||
case 1: {
|
||
item.Name = "内外向综合特质";
|
||
this.scoreSummary1 = item;
|
||
break;
|
||
}
|
||
case 2: {
|
||
item.Name = "人际关系综合特质";
|
||
this.scoreSummary2 = item;
|
||
break;
|
||
}
|
||
case 3: {
|
||
item.Name = "严谨性综合特质";
|
||
this.scoreSummary3 = item;
|
||
break;
|
||
}
|
||
case 4: {
|
||
item.Name = "开放性综合特质";
|
||
this.scoreSummary4 = item;
|
||
break;
|
||
}
|
||
case 5: {
|
||
item.Name = "一致性";
|
||
this.scoreSummary5 = item;
|
||
break;
|
||
}
|
||
}
|
||
})
|
||
this.scoreSummary = data.ScoreSummary;
|
||
this.scoreDetail = data.ScoreDetail;
|
||
let hight = 0;
|
||
let mid = 0;
|
||
let low = 0;
|
||
data.ScoreDetail.forEach(item => {
|
||
if (item.Leavel < 4) {
|
||
hight++
|
||
}
|
||
if (item.Leavel != 3) {
|
||
mid++
|
||
}
|
||
if (item.Leavel >= 3) {
|
||
low++
|
||
}
|
||
})
|
||
if (hight == 12) {
|
||
this.isNoHight = true;
|
||
}
|
||
if (mid == 12) {
|
||
this.isNoMid = true;
|
||
}
|
||
if (low == 12) {
|
||
this.isNoLow = true;
|
||
}
|
||
// 综合特质等级侧面图
|
||
let leavelList = [];
|
||
this.scoreSummary.forEach((item, index) => {
|
||
if (index < 4) {
|
||
leavelList.push(item.Leavel)
|
||
}
|
||
})
|
||
this.data1 = leavelList;
|
||
// 内外向综合特质侧面图
|
||
this.data2 = [data.ScoreDetail[0].Leavel, data.ScoreDetail[1]
|
||
.Leavel, data.ScoreDetail[2].Leavel
|
||
];
|
||
// 人际关系综合特质侧面图
|
||
this.data3 = [data.ScoreDetail[3].Leavel, data.ScoreDetail[4]
|
||
.Leavel, data.ScoreDetail[5].Leavel
|
||
];
|
||
// 严谨性综合特质侧面图
|
||
this.data4 = [data.ScoreDetail[6].Leavel, data.ScoreDetail[7]
|
||
.Leavel, data.ScoreDetail[8].Leavel
|
||
];
|
||
// 开放性综合特质侧面图
|
||
this.data5 = [data.ScoreDetail[9].Leavel, data.ScoreDetail[10]
|
||
.Leavel, data.ScoreDetail[11].Leavel
|
||
];
|
||
this.initChart();
|
||
}
|
||
} else {
|
||
uni.showToast({
|
||
title: res.Message,
|
||
icon: "none"
|
||
})
|
||
}
|
||
})
|
||
},
|
||
//更改对比图
|
||
getValue() {
|
||
//群体维度对比
|
||
api.getPersonTestGroupResult(this.params.year, this.params.term,this.params.schoolId, this.params.gradeid, this.params.classid, this.params.sex, this.params.departId,this.userId,this.params.recordId).then(res => {
|
||
if (res.Result >= 1) {
|
||
this.doChart(res.Data);
|
||
}
|
||
})
|
||
},
|
||
async initChart() {
|
||
let name = this.labelName1;
|
||
let legend = [name];
|
||
this.createdChart('charts1', '综合特质等级侧面图', ['内外向', '人际关系', '严谨性', '开放性'], legend, this.data1);
|
||
this.createdChart('charts2', '内外向综合特质侧面图', ['乐群性', '领导性', '社交性'], legend, this.data2);
|
||
this.createdChart('charts3', '人际关系综合特质侧面图', ['客观性', '顺从性', '亲和性'], legend, this.data3);
|
||
this.createdChart('charts4', '严谨性综合特质侧面图', ['坚毅性', '秩序性', '深思性'], legend, this.data4);
|
||
this.createdChart('charts5', '开放性综合特质侧面图', ['探究性', '变通性', '感觉性'], legend, this.data5);
|
||
},
|
||
//时间维度/群体维度对比
|
||
async doChart(DATA) {
|
||
let name1 = this.labelName1;
|
||
let name2 = this.labelName2;
|
||
let legend = [name1, name2];
|
||
let data1 = [],
|
||
data2 = [],
|
||
data3 = [],
|
||
data4 = [],
|
||
data5 = [];
|
||
if (DATA.result1.data != null) {
|
||
data1 = DATA.result1.data;
|
||
} else {
|
||
data1 = [0, 0, 0, 0];
|
||
}
|
||
if (DATA.result2.data != null) {
|
||
let dataScore = DATA.result2.data
|
||
data2 = [dataScore[0], dataScore[1], dataScore[2]];
|
||
data3 = [dataScore[3], dataScore[4], dataScore[5]];
|
||
data4 = [dataScore[6], dataScore[7], dataScore[8]];
|
||
data5 = [dataScore[9], dataScore[10], dataScore[11]];
|
||
} else {
|
||
data2 = [0, 0, 0];
|
||
data3 = [0, 0, 0];
|
||
data4 = [0, 0, 0];
|
||
data5 = [0, 0, 0];
|
||
}
|
||
|
||
this.createdChart('charts1', '综合特质等级侧面图', ['内外向', '人际关系', '严谨性', '开放性'], legend, this.data1, data1);
|
||
this.createdChart('charts2', '内外向综合特质侧面图', ['乐群性', '领导性', '社交性'], legend, this.data2, data2);
|
||
this.createdChart('charts3', '人际关系综合特质侧面图', ['客观性', '顺从性', '亲和性'], legend, this.data3, data3);
|
||
this.createdChart('charts4', '严谨性综合特质侧面图', ['坚毅性', '秩序性', '深思性'], legend, this.data4, data4);
|
||
this.createdChart('charts5', '开放性综合特质侧面图', ['探究性', '变通性', '感觉性'], legend, this.data5, data5);
|
||
},
|
||
//生成图表
|
||
async createdChart(EL, TITLE, CATEGORIES, LEGEND, DATA1, DATA2) {
|
||
let seriesDataAll = [{
|
||
name: LEGEND[0],
|
||
type: 'line',
|
||
data: DATA1
|
||
}];
|
||
if (DATA2) {
|
||
seriesDataAll.push({
|
||
name: LEGEND[1],
|
||
type: 'line',
|
||
data: DATA2
|
||
})
|
||
}
|
||
const option = {
|
||
tooltip: {
|
||
show:false,
|
||
trigger: 'axis'
|
||
},
|
||
label:{
|
||
|
||
show:true,
|
||
},
|
||
legend: {
|
||
// data: ['Email', 'Union Ads']
|
||
show: true,
|
||
data: LEGEND,
|
||
right: 4,
|
||
top: 4
|
||
},
|
||
grid: {
|
||
left: '3%',
|
||
right: '4%',
|
||
bottom: '3%',
|
||
containLabel: true
|
||
},
|
||
|
||
xAxis: {
|
||
type: 'category',
|
||
data: CATEGORIES
|
||
},
|
||
yAxis: {
|
||
type: 'value',
|
||
max: 5
|
||
},
|
||
series: seriesDataAll
|
||
}
|
||
|
||
// chart 图表实例不能存在data里
|
||
if (EL == "charts1") {
|
||
this.option1 = option;
|
||
const chart = await this.$refs.charts1.init(echarts, "theme");
|
||
chart.clear();
|
||
chart.setOption(option)
|
||
} else if (EL == "charts2") {
|
||
this.option2 = option;
|
||
const chart = await this.$refs.charts2.init(echarts, "theme");
|
||
chart.clear();
|
||
chart.setOption( this.option2)
|
||
} else if (EL == "charts3") {
|
||
this.option3 = option;
|
||
const chart = await this.$refs.charts3.init(echarts, "theme");
|
||
chart.clear();
|
||
chart.setOption(this.option3)
|
||
} else if (EL == "charts4") {
|
||
this.option4 = option;
|
||
const chart = await this.$refs.charts4.init(echarts, "theme");
|
||
chart.clear();
|
||
chart.setOption(this.option4)
|
||
} else if (EL == "charts5") {
|
||
this.option5 = option;
|
||
const chart = await this.$refs.charts5.init(echarts, "theme");
|
||
chart.clear();
|
||
chart.setOption( this.option5)
|
||
}
|
||
},
|
||
goback() {
|
||
uni.navigateBack(-1);
|
||
},
|
||
showTipLayer(INDEX) {
|
||
switch (INDEX) {
|
||
case 1: {
|
||
this.layerTitile = "作答态度";
|
||
this.layerDesc =
|
||
"· 一致性分数代表了你的作答态度，也代表了测评是否更具有参考价值。<br>· 一致性分数越高代表你作答时越诚实认真，测评的结果也更能真实描述你的个性特质。";
|
||
break;
|
||
}
|
||
}
|
||
this.showTip = true;
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
<style lang="scss">
|
||
$image-oss-url: "https://51xuanxiao.oss-cn-hangzhou.aliyuncs.com/Resource/xcx_sygh";
|
||
page {
|
||
background: #EEF1F8 url('#{$image-oss-url}/test_bg.png') no-repeat;
|
||
background-size: contain;
|
||
overflow-y:scroll;
|
||
}
|
||
</style>
|
||
<style lang="scss" scoped>
|
||
$image-oss-url: "https://51xuanxiao.oss-cn-hangzhou.aliyuncs.com/Resource/xcx_sygh";
|
||
.vip-tip-block {
|
||
width: 650rpx;
|
||
height: 400rpx;
|
||
background: #fff url('#{$image-oss-url}/report-vip-tip.png') no-repeat;
|
||
background-size: 100%;
|
||
}
|
||
|
||
.tip-layer {
|
||
.title {
|
||
font-size: 36rpx;
|
||
color: #000000;
|
||
text-align: center;
|
||
font-weight: 600;
|
||
margin-bottom: 30rpx;
|
||
}
|
||
|
||
.desc {
|
||
font-size: 28rpx;
|
||
color: #666666;
|
||
margin-bottom: 20rpx;
|
||
|
||
&:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
.interest-report-wrap {
|
||
min-height: 100vh;
|
||
|
||
.head-bar {
|
||
position: relative;
|
||
text-align: center;
|
||
font-size: 36rpx;
|
||
font-weight: 600;
|
||
height: 60rpx;
|
||
line-height: 60rpx;
|
||
|
||
.go-back {
|
||
position: absolute;
|
||
left: 10rpx;
|
||
top: 0;
|
||
width: 60rpx;
|
||
height: 60rpx;
|
||
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAABUklEQVRoQ+3ZOwrCQBCA4UlyCVsrQauQdPYewcNYWXoHK1s9gYeYdIKlracYWYggkgiTnccuaB3D/+1sYEMKyPxXZN4Pf0DMBOu6XpZluQOANRGduq7bc+/nNoE+/gwAq3c0IrJ72H/grtDQ9UPxAPBAxDn3/uaAkfjQvUXES9IA6fiANZuARrwZQCveBKAZrw7QjlcFWMSrAaziVQCW8eIA63hRgEe8GMArXgTgGR8N8I6PAqQQPxmQSvxkQNM0VwDYfJ3dJ53nuef/7+vZx+l+9W8pxE+aQNu2CyK6ZwsI4VlvoQDI/iFOCcF+iD/3fgqTiAKkMIlogDdCBOCJEAN4IUQBHghxgDVCBWCJUANYIVQBFgh1gDbCBKCJMANoIUwBGghzwA/EExFn3HdkF8AYIpvPrO9VDu8TVVUdiKghomNWH7q5W2Xserct9Af0K/AChQ/cMY9OGScAAAAASUVORK5CYII=") center no-repeat;
|
||
background-size: 38rpx 38rpx;
|
||
}
|
||
}
|
||
.content {
|
||
padding: 35rpx 20rpx 220rpx;
|
||
|
||
.section-block {
|
||
padding: 40rpx 30rpx 40rpx;
|
||
background: #fff;
|
||
border-radius: 12rpx;
|
||
margin-bottom: 20rpx;
|
||
overflow: hidden;
|
||
|
||
.s-line {
|
||
position: relative;
|
||
width: 630rpx;
|
||
margin: 15rpx auto 45rpx;
|
||
height: 2rpx;
|
||
background: #FAFAFA;
|
||
|
||
&:before {
|
||
content: "";
|
||
display: block;
|
||
position: absolute;
|
||
left: -56rpx;
|
||
top: -16rpx;
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
border-radius: 50%;
|
||
background: #EEF1F8;
|
||
}
|
||
|
||
&::after {
|
||
content: "";
|
||
display: block;
|
||
position: absolute;
|
||
right: -56rpx;
|
||
top: -16rpx;
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
border-radius: 50%;
|
||
background: #EEF1F8;
|
||
}
|
||
}
|
||
.title {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-bottom: 35rpx;
|
||
|
||
.name {
|
||
position: relative;
|
||
font-weight: 600;
|
||
font-size: 32rpx;
|
||
color: #000000;
|
||
z-index: 1;
|
||
|
||
&::after {
|
||
content: "";
|
||
display: block;
|
||
position: absolute;
|
||
bottom: -3rpx;
|
||
left: -6rpx;
|
||
width: calc(100% + 12rpx);
|
||
height: 12rpx;
|
||
background: #BBDCFF;
|
||
border-radius: 12rpx;
|
||
z-index: -1;
|
||
}
|
||
}
|
||
|
||
.tip-icon {
|
||
margin-left: 10rpx;
|
||
width: 56rpx;
|
||
height: 56rpx;
|
||
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAMAAABF0y+mAAAAM1BMVEUAAADMzMzPz8/Hx8fLy8vMzMzNzc3Nzc3KysrMzMzMzMzMzMzKysrLy8vMzMzMzMzMzMxTlLHLAAAAEHRSTlMA3xAgQFCPfzCfr+9gcL/P9mj/kgAAAQFJREFUKM9tUtsWwyAIUwS1um78/9fOFPB0l7woEAIi6QZikV7SH5Sa9UJu5Tt06A0H3WM9I2U0lnPgOjltPBDqYTHCj20to9Kl0HFQXQ7n0lSV8OkTirKUrK1j5SGW1QDv4h1Xo4sFsabaiNrKdWYx59Vb1ozjpdNTqjsBWCZIwQVlpMsygWmZaYDUVU9ruievnFJUE3uHo+3ZMfwCxm1Uh90siaHjINVX3E/VDsdwO1SioWI9O0oOXrgrKA6Ki1Xz8UWdabwYXwweeBrdB++VVCVewtHZdLW+P5tKio/ljzXZVvE1CfBEeJzCbeRYqA36XM2fzW2x1PX/0ncRppvjDWNoDuKTMIXYAAAAAElFTkSuQmCC") center no-repeat;
|
||
background-size: 50%;
|
||
border-radius: 50%;
|
||
}
|
||
}
|
||
|
||
.text-desc-wrap {
|
||
padding-bottom: 40rpx;
|
||
|
||
.row {
|
||
position: relative;
|
||
font-size: 28rpx;
|
||
color: #666666;
|
||
margin-bottom: 10rpx;
|
||
padding-left: 16rpx;
|
||
|
||
&:before {
|
||
position: absolute;
|
||
left: 0;
|
||
top: 16rpx;
|
||
content: "";
|
||
display: block;
|
||
width: 6rpx;
|
||
height: 6rpx;
|
||
background: #666;
|
||
border-radius: 50%;
|
||
}
|
||
|
||
.strong {
|
||
color: #1677ff;
|
||
font-weight: 600;
|
||
}
|
||
}
|
||
|
||
.empty-tip {
|
||
font-size: 28rpx;
|
||
color: #666666;
|
||
}
|
||
}
|
||
|
||
.score-item {
|
||
width: 606rpx;
|
||
padding: 25rpx 20rpx;
|
||
background: #F2F9FF;
|
||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||
border: 2rpx solid #E7F4FD;
|
||
background: #F2F9FF;
|
||
margin-bottom: 46rpx;
|
||
|
||
&.blue {
|
||
border: 2rpx solid #E7F4FD;
|
||
background: #F2F9FF;
|
||
}
|
||
|
||
&.purple {
|
||
border: 2rpx solid #ECEEFD;
|
||
background: #F7F7FF;
|
||
}
|
||
|
||
&.orange {
|
||
border: 2rpx solid #FDF1EC;
|
||
background: #FFFBF7;
|
||
}
|
||
|
||
&.green {
|
||
border: 2rpx solid #A5F3C9;
|
||
background: #F4FFF9;
|
||
}
|
||
|
||
.row {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-bottom: 10rpx;
|
||
|
||
.name {
|
||
font-size: 32rpx;
|
||
color: #000000;
|
||
margin-right: 8rpx;
|
||
}
|
||
|
||
.level-label {
|
||
width: 96rpx;
|
||
height: 36rpx;
|
||
background: #1677ff;
|
||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||
text-align: center;
|
||
line-height: 36rpx;
|
||
font-size: 20rpx;
|
||
color: #FFFFFF;
|
||
margin-right: 8rpx;
|
||
}
|
||
|
||
.score-label {
|
||
padding: 0 10rpx;
|
||
height: 36rpx;
|
||
background: #5A73FF;
|
||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||
text-align: center;
|
||
line-height: 36rpx;
|
||
font-size: 20rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
}
|
||
|
||
.item-desc {
|
||
font-size: 28rpx;
|
||
color: #666666;
|
||
line-height: 42rpx;
|
||
}
|
||
}
|
||
|
||
.job-table {
|
||
border-left: 2rpx solid #EEF2FD;
|
||
border-top: 2rpx solid #EEF2FD;
|
||
margin-bottom: 40rpx;
|
||
border-radius: 4rpx;
|
||
width: 630rpx;
|
||
|
||
.tr {
|
||
display: flex;
|
||
|
||
.th {
|
||
width: 180rpx;
|
||
height: 72rpx;
|
||
font-size: 28rpx;
|
||
color: #666666;
|
||
text-align: center;
|
||
line-height: 72rpx;
|
||
background: #f6f9fe;
|
||
font-weight: 600;
|
||
border-right: 2rpx solid #EEF2FD;
|
||
border-bottom: 2rpx solid #EEF2FD;
|
||
|
||
&:nth-child(2) {
|
||
width: 450rpx;
|
||
}
|
||
}
|
||
|
||
.td {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 180rpx;
|
||
min-height: 80rpx;
|
||
font-size: 28rpx;
|
||
line-height: 42rpx;
|
||
color: #666666;
|
||
font-weight: 600;
|
||
border-right: 2rpx solid #EEF2FD;
|
||
border-bottom: 2rpx solid #EEF2FD;
|
||
|
||
&:nth-child(2) {
|
||
width: 410rpx;
|
||
padding: 20rpx 20rpx;
|
||
color: #3095F9;
|
||
}
|
||
|
||
.row {
|
||
display: block;
|
||
width: 100%;
|
||
|
||
.strong {
|
||
font-size: 28rpx;
|
||
color: #666666;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.chat-wrap {
|
||
width: 622rpx;
|
||
min-height: 452rpx;
|
||
border-radius: 12rpx;
|
||
margin: 0 14rpx;
|
||
box-shadow: 0 0 1rpx 14rpx #BBDCFF;
|
||
|
||
.row-item {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
justify-items: center;
|
||
|
||
.charts-box {
|
||
width: 100%;
|
||
height: 200px;
|
||
}
|
||
|
||
}
|
||
|
||
.chat {
|
||
height: 384rpx;
|
||
}
|
||
|
||
&.blue-bg {
|
||
box-shadow: 0 0 1rpx 14rpx #BBDCFF;
|
||
margin-bottom: 44rpx;
|
||
}
|
||
|
||
&.purple-bg {
|
||
box-shadow: 0 0 1rpx 14rpx #C7C7FF;
|
||
margin-bottom: 44rpx;
|
||
}
|
||
|
||
&.orange-bg {
|
||
box-shadow: 0 0 1rpx 14rpx #FFD4A8;
|
||
margin-bottom: 44rpx;
|
||
}
|
||
|
||
&.green-bg {
|
||
box-shadow: 0 0 1rpx 14rpx #8FDAB1;
|
||
margin-bottom: 44rpx;
|
||
}
|
||
|
||
.chat-title {
|
||
padding-top: 25rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 28rpx;
|
||
font-weight: 600;
|
||
color: #000000;
|
||
border-radius: 12rpx 12rpx 0 0;
|
||
}
|
||
}
|
||
|
||
.chat-tip {
|
||
font-size: 24rpx;
|
||
color: #999999;
|
||
|
||
text {
|
||
margin-right: 30rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style> |