From f4a855c93eb8248f56fd1477b2deac4fb71c3dae Mon Sep 17 00:00:00 2001
From: linzhijie <1003392067@qq.com>
Date: 星期二, 16 五月 2023 15:26:38 +0800
Subject: [PATCH] h5页面调整
---
src/views/report/reportH5.vue | 50 ++++++++++++++++++++++++++++----------------------
1 files changed, 28 insertions(+), 22 deletions(-)
diff --git a/src/views/report/reportH5.vue b/src/views/report/reportH5.vue
index 6624eaf..1707d6c 100644
--- a/src/views/report/reportH5.vue
+++ b/src/views/report/reportH5.vue
@@ -1,26 +1,28 @@
<template>
- <div id="app">
+ <div id="app" style="margin:auto">
<div class="report">
<el-image :src="require('@/assets/report/page1.jpg')"></el-image>
- <div class="word" style="left: 23.5%;top: 68.6%;font-size: 0.8rem;color: #313157">銆恵{ data.questionnaireTaker }}銆�</div>
- <div class="word" style="left: 27%;top: 71.2%;font-size: 0.8rem;color: #313157">銆恵{ data.reportGenerationDate }}銆�</div>
+ <div class="word" style="left: 27%;top: 66.8%;font-size: 0.8rem;color: #313157">{{ data.questionnaireTaker }}</div>
+ <div class="word" style="left: 30.5%;top: 69.2%;font-size: 0.8rem;color: #313157">{{ data.reportGenerationDate }}</div>
+ <div class="word" style="left: 23%;top: 71.5%;font-size: 0.8rem;color: #313157">涓浗澶у鐢�</div>
</div>
<div class="report">
<el-image :src="require('@/assets/report/page2.png')"></el-image>
<div id="myChart" style="width: 100%; height: 300px; "></div>
</div>
-
<div class="report">
<el-image :src="require('@/assets/report/page3.png')"></el-image>
- <div class="word" style="left: 40%;top: 3.3%;font-size: 0.8rem;color: #34BBC4">{{ data.PR_Dim01 }}</div>
- <div class="word" style="left: 40%;top: 6.3%;font-size: 0.8rem;color: #E1AD04">{{ data.PR_Dim02 }}</div>
- <div class="word" style="left: 40%;top: 9.3%;font-size: 0.8rem;color: #6D67AD">{{ data.PR_Dim03 }}</div>
- <div class="word" style="left: 40%;top: 12.3%;font-size: 0.8rem;color: #EC7864">{{ data.PR_Dim04 }}</div>
- <div class="word" style="left: 80%;top: 3.3%;font-size: 0.8rem;color: #D78EBB">{{ data.PR_Dim05 }}</div>
- <div class="word" style="left: 80%;top: 6.3%;font-size: 0.8rem;color: #E8497D">{{ data.PR_Dim06 }}</div>
- <div class="word" style="left: 80%;top: 9.3%;font-size: 0.8rem;color: #62BEA4">{{ data.PR_Dim07 }}</div>
- <div class="word" style="left: 80%;top: 12.3%;font-size: 0.8rem;color: #4976BA">{{ data.PR_Dim08 }}</div>
- <div class="word career" style="left: 14%;top: 36.3%;font-size: 0.6rem;font-weight: bold;line-height:25px">
+ <div class="word" style="left: 40%;top: 9.8%;font-size: 0.8rem;color: #34BBC4">{{ data.PR_Dim01 }}</div>
+ <div class="word" style="left: 40%;top: 18.4%;font-size: 0.8rem;color: #E1AD04">{{ data.PR_Dim02 }}</div>
+ <div class="word" style="left: 40%;top: 26.6%;font-size: 0.8rem;color: #6D67AD">{{ data.PR_Dim03 }}</div>
+ <div class="word" style="left: 40%;top: 35.6%;font-size: 0.8rem;color: #EC7864">{{ data.PR_Dim04 }}</div>
+ <div class="word" style="left: 80%;top: 9.8%;font-size: 0.8rem;color: #D78EBB">{{ data.PR_Dim05 }}</div>
+ <div class="word" style="left: 80%;top: 18.4%;font-size: 0.8rem;color: #E8497D">{{ data.PR_Dim06 }}</div>
+ <div class="word" style="left: 80%;top: 26.6%;font-size: 0.8rem;color: #62BEA4">{{ data.PR_Dim07 }}</div>
+ <div class="word" style="left: 80%;top: 35.6%;font-size: 0.8rem;color: #4976BA">{{ data.PR_Dim08 }}</div>
+ </div>
+ <div style="border:2px solid #F3EEE3;border-radius: 25px;margin-left: 8%;margin-right: 8%;">
+ <div style="font-size: 0.9rem;font-weight: bold;line-height: 25px;padding: 15px;">
1.{{data.occ1H}}<br>
2.{{data.occ2H}}<br>
3.{{data.occ3H}}<br>
@@ -32,7 +34,12 @@
9.{{data.occ9H}}<br>
10.{{data.occ10H}}
</div>
- <div class="word career" style="left: 14%;top: 72%;font-size: 0.6rem;font-weight: bold;line-height:25px">
+ </div>
+ <div class="report">
+ <el-image :src="require('@/assets/report/page3-1.png')"></el-image>
+ </div>
+ <div style="border:2px solid #F3EEE3;border-radius: 25px;margin-left: 8%;margin-right: 8%;">
+ <div style="font-size: 0.9rem;font-weight: bold;line-height: 25px;padding: 15px;">
1.{{data.occ1L}}<br>
2.{{data.occ2L}}<br>
3.{{data.occ3L}}<br>
@@ -46,15 +53,15 @@
</div>
</div>
<div class="report">
- <div v-if="data.condition != null">
+ <div v-if="data.condition != null && data.condition != ''">
<el-image :src="require('@/assets/report/page4.png')"></el-image>
</div>
- <div v-if="data.condition == null">
+ <div v-if="data.condition == null || data.condition == ''">
<el-image :src="require('@/assets/report/page4-1.png')"></el-image>
</div>
</div>
<div class="report">
- <el-image :src="require('@/assets/report/page5.png')"></el-image>
+ <el-image :src="require('@/assets/report/page5.jpg')"></el-image>
</div>
</div>
</template>
@@ -67,7 +74,6 @@
data () {
return {
tokenId: this.$route.query.tokenId,
- condition: true,
data: {
occ1L: '鍦拌川鍕樻帰宸ョ▼鎶�鏈汉鍛橈紙姣斿鍦拌川鐭夸骇璋冩煡宸ョ▼鎶�鏈汉鍛橈級',
occ3L: '鐭垮北宸ョ▼鎶�鏈汉鍛橈紙姣斿閫夌熆涓庣熆鐗╁姞宸ュ伐绋嬫妧鏈汉鍛橈級',
@@ -373,13 +379,13 @@
.career {
display: inline-block;
- width: 260px;
+ width: 72%;
/*瓒呭嚭閮ㄥ垎闅愯棌*/
- overflow: hidden;
+ /*overflow: hidden;*/
/*鏂囨湰涓嶆崲琛�*/
- white-space: nowrap;
+ /*white-space: nowrap;*/
/*瓒呭嚭涓嶅皝鐢ㄤ笁涓渷鐣ュ彿浠ｆ浛*/
- text-overflow: ellipsis;
+ /*text-overflow: ellipsis;*/
}
#app {
--
Gitblit v1.9.1