From 57f1b45ee6d64bc6bf6fc65b30a06434e032a4aa Mon Sep 17 00:00:00 2001
From: linzhijie <1003392067@qq.com>
Date: 星期五, 28 四月 2023 18:01:20 +0800
Subject: [PATCH] H5页面提交
---
/dev/null | 95 -----------
src/assets/report/page1.png | 0
src/assets/report/page1.jpg | 0
src/assets/report/page3.png | 0
src/assets/report/page2.png | 0
src/assets/report/page4-1.png | 0
src/assets/report/page4.png | 0
src/views/pdf/reportH5.vue | 357 ++++++++++++++++++++++++++++++++++++++-----
src/assets/report/page5.png | 0
9 files changed, 311 insertions(+), 141 deletions(-)
diff --git a/dist.zip b/dist.zip
deleted file mode 100644
index e1c10d7..0000000
--- a/dist.zip
+++ /dev/null
Binary files differ
diff --git "a/public/SETPOINT\350\201\214\344\270\232\345\205\264\350\266\243\351\207\217\350\241\250\345\217\215\351\246\210\346\212\245\345\221\2121.0.pdf" "b/public/SETPOINT\350\201\214\344\270\232\345\205\264\350\266\243\351\207\217\350\241\250\345\217\215\351\246\210\346\212\245\345\221\2121.0.pdf"
deleted file mode 100644
index 2729399..0000000
--- "a/public/SETPOINT\350\201\214\344\270\232\345\205\264\350\266\243\351\207\217\350\241\250\345\217\215\351\246\210\346\212\245\345\221\2121.0.pdf"
+++ /dev/null
Binary files differ
diff --git a/src/assets/report/page1.jpg b/src/assets/report/page1.jpg
new file mode 100644
index 0000000..07f99e9
--- /dev/null
+++ b/src/assets/report/page1.jpg
Binary files differ
diff --git a/src/assets/report/page1.png b/src/assets/report/page1.png
index 1c810f9..a459faf 100644
--- a/src/assets/report/page1.png
+++ b/src/assets/report/page1.png
Binary files differ
diff --git a/src/assets/report/page2.png b/src/assets/report/page2.png
index 673eef5..b8efcd3 100644
--- a/src/assets/report/page2.png
+++ b/src/assets/report/page2.png
Binary files differ
diff --git a/src/assets/report/page3.png b/src/assets/report/page3.png
new file mode 100644
index 0000000..0f6f988
--- /dev/null
+++ b/src/assets/report/page3.png
Binary files differ
diff --git a/src/assets/report/page4-1.png b/src/assets/report/page4-1.png
new file mode 100644
index 0000000..5db5677
--- /dev/null
+++ b/src/assets/report/page4-1.png
Binary files differ
diff --git a/src/assets/report/page4.png b/src/assets/report/page4.png
new file mode 100644
index 0000000..68208dd
--- /dev/null
+++ b/src/assets/report/page4.png
Binary files differ
diff --git a/src/assets/report/page5.png b/src/assets/report/page5.png
new file mode 100644
index 0000000..6827271
--- /dev/null
+++ b/src/assets/report/page5.png
Binary files differ
diff --git a/src/assets/style/rem b/src/assets/style/rem
deleted file mode 100644
index 71616a7..0000000
--- a/src/assets/style/rem
+++ /dev/null
@@ -1,27 +0,0 @@
-;
-(function(win){
- var doc = win.document;
- var docEl = doc.documentElement;
- var tid;
-
- function refreshRem(){
- var width = docEl.getBoundingClientRect().width;
- if(width>640){
- width = 640;
- }
- var rem = width /6.4;
- docEl.style.fontSize = rem +'px';
- }
- win.addEventListener('resize',function(){
- clearTimeout(tid);
- tid = setTimeout(refreshRem,300);
- },false);
- win.addEventListener('pageshow',function(e){
- if(e.persisted){
- clearTimeout(tid);
- tid = setTimeout(refreshRem,300);
- }
- },false);
-
- refreshRem();
-})(window);
\ No newline at end of file
diff --git a/src/assets/style/reset.css b/src/assets/style/reset.css
deleted file mode 100644
index 538d66e..0000000
--- a/src/assets/style/reset.css
+++ /dev/null
@@ -1,95 +0,0 @@
-/**
- * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
- * http://cssreset.com
- */
-html, body, div, span, applet, object, iframe,
-h1, h2, h3, h4, h5, h6, p, blockquote, pre,
-a, abbr, acronym, address, big, cite, code,
-del, dfn, em, img, ins, kbd, q, s, samp,
-small, strike, strong, sub, sup, tt, var,
-b, u, i, center,
-dl, dt, dd, ol, ul, li,
-fieldset, form, label, legend,
-table, caption, tbody, tfoot, thead, tr, th, td,
-article, aside, canvas, details, embed,
-figure, figcaption, footer, header,
-menu, nav, output, ruby, section, summary,
-time, mark, audio, video, input {
- margin: 0;
- padding: 0;
- border: 0;
- font-size: 100%;
- font-weight: normal;
- vertical-align: baseline;
-}
-
-/* HTML5 display-role reset for older browsers */
-article, aside, details, figcaption, figure,
-footer, header, menu, nav, section {
- display: block;
-}
-
-body {
- line-height: 1;
-}
-
-blockquote, q {
- quotes: none;
-}
-
-blockquote:before, blockquote:after,
-q:before, q:after {
- content: none;
-}
-
-table {
- border-collapse: collapse;
- border-spacing: 0;
-}
-
-/* custom */
-a {
- color: #7e8c8d;
- text-decoration: none;
- -webkit-backface-visibility: hidden;
-}
-
-li {
- list-style: none;
-}
-
-::-webkit-scrollbar {
- width: 5px;
- height: 5px;
-}
-
-::-webkit-scrollbar-track-piece {
- background-color: rgba(0, 0, 0, 0.2);
- -webkit-border-radius: 6px;
-}
-
-::-webkit-scrollbar-thumb:vertical {
- height: 5px;
- background-color: rgba(125, 125, 125, 0.7);
- -webkit-border-radius: 6px;
-}
-
-::-webkit-scrollbar-thumb:horizontal {
- width: 5px;
- background-color: rgba(125, 125, 125, 0.7);
- -webkit-border-radius: 6px;
-}
-
-html, body {
- width: 100%;
-}
-
-body {
- -webkit-text-size-adjust: none;
- -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-}
-html{
- height: 100%;
- width: 100%;
- background: #f3f3f3;
-}
\ No newline at end of file
diff --git a/src/views/pdf/reportH5.vue b/src/views/pdf/reportH5.vue
index e7330b7..4e8da18 100644
--- a/src/views/pdf/reportH5.vue
+++ b/src/views/pdf/reportH5.vue
@@ -1,66 +1,331 @@
<template>
- <div>
- <div id="page1" style="margin-top: 16%;">
- <el-image :src="require('@/assets/report/page1.png')">
- </el-image>
- <div style="left: 19%;position: absolute;top: 12%;font-weight: bold;font-size: 1rem;">涓浗澶у鐢熻亴涓氬叴瓒ｉ噺琛�</div>
- <div style="left: 9%;position: absolute;top: 65%;font-weight: bold;font-size: 2.1rem;">涓汉鍙嶉鎶ュ憡</div>
- <div style="left: 10%;position: absolute;top: 72%;font-size: 0.1rem;">娴� 璇� 鑰咃細銆�%questionnaireTaker%銆�</div>
- <div style="left: 10%;position: absolute;top: 74%;font-size: 0.1rem;">娴嬭瘯鏃堕棿锛氥��%reportGenerationDate%銆�</div>
- <div style="left: 10%;position: absolute;top: 76%;font-size: 0.1rem;">甯� 妯★細涓浗澶у鐢�</div>
- <div style="left: 10%; position: absolute; top: 79%; font-size: 0.1rem;">鎶ュ憡涓昏鍐呭锛�</div>
- <div style="left: 10%;position: absolute;top: 81%;font-size: 0.1rem;">1. 鍏ぇ鑱屼笟鍏磋叮涓婚鐨勪粙缁嶅強涓汉鍒嗘暟</div>
- <div style="left: 10%;position: absolute;top: 83%;font-size: 0.1rem;width: 85%;">2. 鍩轰簬銆婁腑鍗庝汉姘戝叡鍜屽浗鑱屼笟鍒嗙被澶у吀锛�2022鐗堬級銆嬬敓鎴愮殑涓汉鑱屼笟鏂瑰悜鎴栭鍩熺殑鎺ㄨ崘娓呭崟</div>
+ <div id="app">
+ <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">銆愭灄鑷存澃銆�</div>
+ <div class="word" style="left: 27%;top: 71.2%;font-size: 0.8rem;color: #313157">銆�2023/04/28銆�</div>
</div>
- <div style="height: 1700px;background-color: white">
- 鎶ュ憡浠嬬粛
- 鑱屼笟鍏磋叮鏄奖鍝嶆垜浠敓娑�夋嫨鐨勯噸瑕佸洜绱犱箣涓�锛屼粠浜嬩笌鑷繁鍏磋叮鐩稿叧鐨勮亴涓氫篃鏈夊姪浜庢垜浠湪宸ヤ綔涓彇寰楄緝濂界殑缁╂晥琛ㄧ幇浠ュ強宸ヤ綔婊℃剰搴︺�傛垜浠緷鎹亴涓氬叴瓒ETPOINT妯″瀷锛圫u et al., 2019锛夛紝骞跺熀浜庝腑鍥藉浗鎯呭紑鍙戜簡鏈娴嬭瘯鐨勯鐩�傛湰娴嬮獙娴嬮噺浜嗘偍鍦ㄥ叓澶ц亴涓氬叴瓒ｄ富棰樹笂鐨勫緱鍒嗭紝鎮ㄧ殑娴嬭瘯鍒嗘暟鏄湪浠ヤ腑鍥戒汉缇や负甯告ā鐨勫熀纭�涓婅绠楀嚭鐨勭櫨鍒嗕綅鏁般�傚彟澶栵紝鎴戜滑瀵广�婁腑鍗庝汉姘戝叡鍜屽浗鑱屼笟鍒嗙被澶у吀锛�2022鐗堬級銆嬩腑鍑虹幇鐨勮亴涓氱被鍨嬭繘琛屼簡缂栫爜锛屽苟鍩轰簬鎮ㄧ殑鍏磋叮鐗圭偣锛岀敓鎴愪簡鎮ㄥ彲鑳芥渶鎰熷叴瓒ｇ殑鍗佷釜鑱屼笟绫诲瀷鍜屾偍鍙兘鏈�涓嶆劅鍏磋叮鐨勫崄涓亴涓氱被鍨嬶紝甯姪鎮ㄦ洿鏈夋晥鍦版帰绱㈣亴涓氱敓娑�備换浣曞績鐞嗘祴璇曢兘涓嶅彲鑳藉仛鍒板畬鍏ㄧ簿纭紝鎵�浠ユ祴璇曞垎鏁颁互鍙婃帹鑽愮殑鑱屼笟绫诲瀷浠呬緵鎮ㄥ弬鑰冦��
+ <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">12</div>
+ <div class="word" style="left: 40%;top: 6.3%;font-size: 0.8rem;color: #E1AD04">12</div>
+ <div class="word" style="left: 40%;top: 9.3%;font-size: 0.8rem;color: #6D67AD">12</div>
+ <div class="word" style="left: 40%;top: 12.3%;font-size: 0.8rem;color: #EC7864">12</div>
+ <div class="word" style="left: 80%;top: 3.3%;font-size: 0.8rem;color: #D78EBB">12</div>
+ <div class="word" style="left: 80%;top: 6.3%;font-size: 0.8rem;color: #E8497D">12</div>
+ <div class="word" style="left: 80%;top: 9.3%;font-size: 0.8rem;color: #62BEA4">12</div>
+ <div class="word" style="left: 80%;top: 12.3%;font-size: 0.8rem;color: #4976BA">12</div>
+ <div class="word" style="left: 14%;top: 36.3%;font-size: 0.6rem;font-weight: bold;line-height:25px">
+ 1.%occ1H%<br>
+ 2.%occ2H%<br>
+ 3.%occ3H%<br>
+ 4.%occ4H%<br>
+ 5.%occ5H%<br>
+ 6.%occ6H%<br>
+ 7.%occ7H%<br>
+ 8.%occ8H%<br>
+ 9.%occ9H%<br>
+ 10.%occ10H%
+ </div>
+ <div class="word" style="left: 14%;top: 72%;font-size: 0.6rem;font-weight: bold;line-height:25px">
+ 1.%occ1H%<br>
+ 2.%occ2H%<br>
+ 3.%occ3H%<br>
+ 4.%occ4H%<br>
+ 5.%occ5H%<br>
+ 6.%occ6H%<br>
+ 7.%occ7H%<br>
+ 8.%occ8H%<br>
+ 9.%occ9H%<br>
+ 10.%occ10H%
+ </div>
+ </div>
+ <div class="report">
+ <div v-if="condition == 1">
+ <el-image :src="require('@/assets/report/page4.png')"></el-image>
+ </div>
+ <div v-if="condition == 0">
+ <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>
</div>
</div>
</template>
<script>
-// import '@/assets/style/rem'
-// import '@/assets/style/reset.css'
-
export default {
name: 'reportH5',
+ data() {
+ return {
+ condition: true
+ }
+ },
mounted () {
+ this.drawLine()
},
methods: {
+ drawLine () {
+ // 鍩轰簬鍑嗗濂界殑dom锛屽垵濮嬪寲echarts瀹炰緥
+ let myChart = this.$echarts.init(document.getElementById('myChart'))
+ let option = {
+ title: {
+ text: '鑱屼笟鍏磋叮涓婚寰楀垎',
+ show: false
+ },
+ legend: {},
+ radar: {
+ // shape: 'circle',
+ nameGap: 15,
+ center: ['50%', '50%'],
+ // 鍦嗕腑蹇冨潗鏍囷紝鏁扮粍鐨勭涓�椤规槸妯潗鏍囷紝绗簩椤规槸绾靛潗鏍囥�俒 default: ['50%', '50%'] ]
+ radius: 120,
+ // 鍦嗙殑鍗婂緞锛屾暟缁勭殑绗竴椤规槸鍐呭崐寰勶紝绗簩椤规槸澶栧崐寰勩��
+ startAngle: 90,
+ indicator: [
+ {
+ name: '鍋ュ悍绉戝', max: '100',
+ //鑻ュ皢姝ゅ睘鎬ф斁鍦╮adar涓嬶紝鍒欐瘡鏉ndicator閮戒細鏄剧ず鍦堜笂鐨勬暟鍊硷紝鏀惧湪杩欏効锛屽彧鍦ㄩ�氫俊杩欐潯indicator涓婃樉绀�
+ axisLabel: {
+ show: true,
+ fontSize: 8,
+ color: '#7F7F7F',
+ showMaxLabel: true, //涓嶆樉绀烘渶澶у�硷紝鍗冲鍦堜笉鏄剧ず鏁板瓧30
+ showMinLabel: true, //鏄剧ず鏈�灏忔暟瀛楋紝鍗充腑蹇冪偣鏄剧ず0
+ }
+ },
+ { name: '浜嬬墿', max: '100' },
+ { name: '鑷劧', max: '100' },
+ { name: '褰卞搷', max: '100' },
+ { name: '缁勭粐', max: '100' },
+ { name: '浜�', max: '100' },
+ { name: '绉戞妧', max: '100' },
+ { name: '鍒涢�犳�ц〃杈�', max: '100' }
+ ],
+ splitArea: { //鍦嗙幆鍖哄煙鏍峰紡
+ areaStyle: {
+ color: ['#fff', '#fff', '#fff'],
+ shadowColor: 'rgba(230, 230, 230, 0.5)',
+ shadowBlur: 20,
+ shadowOffsetY: '10',
+ shadowOffsetX: '-10'
+ }
+ },
+ splitNumber: 4,
+ axisName: {
+ color: '#7F7F7F',
+ fontSize: 10
+ },
+ axisLine: {
+ show: false,
+ lineStyle: {
+ shadowColor: '#F5F4F4',
+ shadowBlur: 10
+ }
+ }
+ },
+ series: [
+ {
+ name: '鍋ュ悍绉戝',
+ type: 'radar',
+ z: 1,
+ areaStyle: {
+ color: '#E5E3E3' //闃村奖
+ },
+ itemStyle: {//鎶樼嚎鎷愮偣鏍囧織鐨勬牱寮�
+ color: "#34BBC4"
+ },
+ lineStyle: {//绾挎潯鏍峰紡
+ color: "#C0BEBD"
+ },
+ symbolSize: 13,//鍦嗙偣澶у皬
+ symbol: "circle",//鍦嗙偣鏍峰紡
+ data: [
+ {
+ value: [50, 16, 22, 78, 55, 82, 67, 23],
+ }
+ ]
+ },
+ {
+ name: '鍒涢�犳�ц〃杈�',
+ type: 'radar',
+ z: 2,
+ itemStyle: {//鎶樼嚎鎷愮偣鏍囧織鐨勬牱寮�
+ color: "#E1AD04"
+ },
+ lineStyle: {
+ width: 0,
+ labelLine: {
+ show: false, //闅愯棌鏍囩ず绾�
+ }
+ },
+ symbolSize: 13,//鍦嗙偣澶у皬
+ symbol: "circle",//鍦嗙偣鏍峰紡
+ data: [
+ {
+ // 鎬濇兂鏄細璁剧疆鏃犵嚎澶э紝鍘绘帀閾炬帴绾垮嵆鍙�
+ value: ['1000', '1000', '1000', '1000', '1000', '1000', '1000', 23]
+ }
+ ]
+ },
+ {
+ name: '绉戞妧',
+ type: 'radar',
+ z: 2,
+ itemStyle: {//鎶樼嚎鎷愮偣鏍囧織鐨勬牱寮�
+ color: "#6D67AD"
+ },
+ lineStyle: {
+ width: 0,
+ labelLine: {
+ show: false //闅愯棌鏍囩ず绾�
+ }
+ },
+ symbolSize: 13,//鍦嗙偣澶у皬
+ symbol: "circle",//鍦嗙偣鏍峰紡
+ data: [
+ {
+ // 鎬濇兂鏄細璁剧疆鏃犵嚎澶э紝鍘绘帀閾炬帴绾垮嵆鍙�
+ value: ['1000', '1000', '1000', '1000', '1000', '1000', '67', '1000']
+ }
+ ]
+ },
+ {
+ name: '浜�',
+ type: 'radar',
+ z: 2,
+ itemStyle: {//鎶樼嚎鎷愮偣鏍囧織鐨勬牱寮�
+ color: "#EC7864"
+ },
+ lineStyle: {
+ width: 0,
+ labelLine: {
+ show: false //闅愯棌鏍囩ず绾�
+ }
+ },
+ symbolSize: 13,//鍦嗙偣澶у皬
+ symbol: "circle",//鍦嗙偣鏍峰紡
+ data: [
+ {
+ // 鎬濇兂鏄細璁剧疆鏃犵嚎澶э紝鍘绘帀閾炬帴绾垮嵆鍙�
+ value: ['1000', '1000', '1000', '1000', '1000', '82', '1000', '1000']
+ }
+ ]
+ },
+ {
+ name: '缁勭粐',
+ type: 'radar',
+ z: 2,
+ itemStyle: {//鎶樼嚎鎷愮偣鏍囧織鐨勬牱寮�
+ color: "#D78EBB"
+ },
+ lineStyle: {
+ width: 0,
+ labelLine: {
+ show: false //闅愯棌鏍囩ず绾�
+ }
+ },
+ symbolSize: 13,//鍦嗙偣澶у皬
+ symbol: "circle",//鍦嗙偣鏍峰紡
+ data: [
+ {
+ // 鎬濇兂鏄細璁剧疆鏃犵嚎澶э紝鍘绘帀閾炬帴绾垮嵆鍙�
+ value: ['1000', '1000', '1000', '1000', '55', '1000', '1000', '1000']
+ }
+ ]
+ },
+ {
+ name: '褰卞搷',
+ type: 'radar',
+ z: 2,
+ itemStyle: {//鎶樼嚎鎷愮偣鏍囧織鐨勬牱寮�
+ color: "#E8497D"
+ },
+ lineStyle: {
+ width: 0,
+ labelLine: {
+ show: false //闅愯棌鏍囩ず绾�
+ }
+ },
+ symbolSize: 13,//鍦嗙偣澶у皬
+ symbol: "circle",//鍦嗙偣鏍峰紡
+ data: [
+ {
+ // 鎬濇兂鏄細璁剧疆鏃犵嚎澶э紝鍘绘帀閾炬帴绾垮嵆鍙�
+ value: ['1000', '1000', '1000', '78', '1000', '1000', '1000', '1000'],
+ }
+ ]
+ },
+ {
+ name: '鑷劧',
+ type: 'radar',
+ z: 2,
+ itemStyle: {//鎶樼嚎鎷愮偣鏍囧織鐨勬牱寮�
+ color: "#62BEA4"
+ },
+ lineStyle: {
+ width: 0,
+ labelLine: {
+ show: false //闅愯棌鏍囩ず绾�
+ },
+ },
+ symbolSize: 13,//鍦嗙偣澶у皬
+ symbol: "circle",//鍦嗙偣鏍峰紡
+ data: [
+ {
+ // 鎬濇兂鏄細璁剧疆鏃犵嚎澶э紝鍘绘帀閾炬帴绾垮嵆鍙�
+ value: ['1000', '1000', '22', '1000', '1000', '1000', '1000', '1000'],
+ }
+ ]
+ },
+ {
+ name: '浜嬬墿',
+ type: 'radar',
+ z: 2,
+ itemStyle: {//鎶樼嚎鎷愮偣鏍囧織鐨勬牱寮�
+ color: "#4976BA"
+ },
+ lineStyle: {
+ width: 0,
+ labelLine: {
+ show: false //闅愯棌鏍囩ず绾�
+ }
+ },
+ symbolSize: 13,//鍦嗙偣澶у皬
+ symbol: "circle",//鍦嗙偣鏍峰紡
+ data: [
+ {
+ // 鎬濇兂鏄細璁剧疆鏃犵嚎澶э紝鍘绘帀閾炬帴绾垮嵆鍙�
+ value: ['1000', '16', '1000', '1000', '1000', '1000', '1000', '1000'],
+ }
+ ]
+ }
+ ]
+ }
+ // 缁樺埗鍥捐〃
+ myChart.setOption(option)
+ }
}
}
</script>
<style scoped>
-/* 鑳屾櫙鍥剧墖*/
-.page1{
- margin-top: 50px;
- background:url('~@/assets/report/page1.png') no-repeat;
- width: 100%;
- height: 100%;
- position:fixed;
- background-size: cover;
- background-size:100% 100%;
-}
+ .report {
+ position: relative
+ }
-.one {
- background:url('~@/assets/report/page1.png') no-repeat;
- width: 100%;
- height: 100%;
- position:fixed;
- background-size:100% 100%;
-}
+ .report .word {
+ position: absolute;
+ }
-.two {
- background:url('~@/assets/report/page2.png') no-repeat;
- width: 100%;
- height: 100%;
- position:fixed;
- background-size:100% 100%;
-}
-
-.font {
- font-family: 榛戜綋;
-}
+ #app {
+ max-width: 100vh;
+ max-height: 100vh
+ }
</style>
--
Gitblit v1.9.1