3 年之前 · 107dd7bf5c
--- a/src/jfw/modules/app/src/web/templates/active/yearEndReport/index.html
+++ b/src/jfw/modules/app/src/web/templates/active/yearEndReport/index.html
@@ -1,10 +1,721 @@
 
				 <!DOCTYPE html>
			
 
				-<html lang="en">
			
 
				+<html lang="zh-CN" style="font-size: 50px;">
			
 
				+
			
 
				 <head>
			
 
				-    <meta charset="UTF-8">
			
 
				-    <title>this is year report</title>
			
 
				+    <meta charset="utf-8">
			
 
				+    <meta name="keywords" content="剑鱼标讯">
			
 
				+    <meta name="description" content="剑鱼标讯">
			
 
				+    <meta name="author" content="剑鱼标讯">
			
 
				+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
			
 
				+    <meta name="viewport"
			
 
				+          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
			
 
				+    <meta name="x5-page-mode" content="app">
			
 
				+    <meta name="apple-mobile-web-app-capable" content="yes">
			
 
				+    <meta name="apple-mobile-web-app-status-bar-style" content="black">
			
 
				+    <meta name="format-detection" content="telephone=no">
			
 
				+    <meta name="referrer" content="no-referrer">
			
 
				+    <link rel="icon" href="/favicon.ico">
			
 
				+    <title>年度报告</title>
			
 
				+    <link rel="preload" as="style" href="https://cdn-common.jianyu360.com/cdn/lib/reset-css/5.0.1/reset.min.css"/>
			
 
				+    <link rel="preload" as="style" href="https://cdn-common.jianyu360.com/cdn/lib/swiper/5.4.2/swiper.min.css"/>
			
 
				+    <l  ink rel="stylesheet" href="https://cdn-common.jianyu360.com/cdn/lib/reset-css/5.0.1/reset.min.css"/>
			
 
				+    <link rel="stylesheet" href="https://cdn-common.jianyu360.com/cdn/lib/animate-css/4.1.1/animate.css"/>
			
 
				+    <link rel="stylesheet" href="https://cdn-common.jianyu360.com/cdn/lib/swiper/5.4.2/swiper.min.css"/>
			
 
				+    <link rel="stylesheet" href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/css/music.css">
			
 
				+    <link rel="stylesheet" href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/css/index.css">
			
 
				+    <script src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/js/rem.js"></script>
			
 
				 </head>
			
 
				+
			
 
				 <body>
			
 
				-app年报
			
 
				+
			
 
				+<div class="jy-report" v-cloak>
			
 
				+    <!-- S--MUSIC -->
			
 
				+    <audio id="audio" controls loop src='https://www.jianyu360.cn/big-member/video/music.mp3' autoplay></audio>
			
 
				+    <div id="music-control-box">
			
 
				+        <div class="music-icon-box">
			
 
				+            <img class="icon-music-on" src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/music/music.png' />
			
 
				+            <img class="icon-music-off" src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/music/music-off.png' />
			
 
				+        </div>
			
 
				+    </div>
			
 
				+    <!-- E--MUSIC -->
			
 
				+    <!-- S--Toast -->
			
 
				+    <div class="jy-toast" style="z-index: 2003;" v-show="showToastText">
			
 
				+        <div class="jy-toast__text">${showToastText}</div>
			
 
				+    </div>
			
 
				+    <!-- E--Toast -->
			
 
				+    <!-- Swiper -->
			
 
				+    <div class="swiper-container" ref="mySwiper">
			
 
				+        <div class="swiper-wrapper">
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-1">
			
 
				+                        <div class="user-info-group">
			
 
				+                            <img animate-name="up" animate-delay="600" class="jy-user-img" :src="pageInfo.user_head" alt="">
			
 
				+                            <p animate-name="up" animate-delay="600" class="jy-user-name">Hi~<span>${pageInfo.user_name}</span></p>
			
 
				+                            <p animate-name="up" animate-delay="200" class="tip-info">
			
 
				+                                <span class="text-hello">欢迎来到你的...</span>
			
 
				+                                <span>2021剑鱼之旅</span>
			
 
				+                            </p>
			
 
				+                            <div class="read_pact" animate-name="up" animate-delay="800">
			
 
				+                                <input @change="changeReadPact" v-model="readPact" type="checkbox" id="read" name="read_pact" value="read_pact">
			
 
				+                                <label for="read">同意剑鱼统计我的使用数据，</label><a href="">查看授权协议</a>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                        <div animate-name="up" animate-delay="500" class="go-report">
			
 
				+                            <div class="go-button" @click="goStart">即刻启程</div>
			
 
				+                        </div>
			
 
				+                        <div class="add-layer-group">
			
 
				+                            <img class="meteor-left" src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P1/meteor.png">
			
 
				+                            <img class="meteor-mini" src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P1/meteor-mini.png">
			
 
				+                            <img class="meteor-bg" src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P1/bottom-bg.png">
			
 
				+                        </div>
			
 
				+                        <img animate-name="up" animate-delay="900" class="jy-logo" src="https://www.jianyu360.cn/images/pc/logo.png" alt="">
			
 
				+                        <div class="next-page"></div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+             <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-2">
			
 
				+                        <div class="meet">
			
 
				+                            <p animate-name="up" animate-delay="200" class="hello">醉纸鸢，你好呀！</p>
			
 
				+                            <p animate-name="up" animate-delay="400" style="margin-top: 0.32rem; margin-left: 1.54rem;">
			
 
				+                                <span class="text">还记得</span>
			
 
				+                                <span class="time">2019年3月27日</span>
			
 
				+                                <span class="text">吗？</span>
			
 
				+                            </p>
			
 
				+                            <div class="star-two">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P2/star-two.png" alt="">
			
 
				+                            </div>
			
 
				+                            <p animate-name="up" animate-delay="800" class="text-a" style="margin-top: 4.52rem;">很开心能遇见你</p>
			
 
				+                            <div class="fish-two">
			
 
				+                                <img class="swiper-lazy"  data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P2/fish-two.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="tail-two">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P2/tail-two.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                            <div>
			
 
				+                                <img class="swiper-lazy ball-two" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P2/ball-two.png" alt="">
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-3">
			
 
				+                        <div class="usage-days">
			
 
				+                            <div class="today">今天</div>
			
 
				+                            <div class="text">是我们一起同行的</div>
			
 
				+                            <div class="days">第732天</div>
			
 
				+                        </div>
			
 
				+                        <div class="star-three">
			
 
				+                            <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P3/star-three.png" alt="">
			
 
				+                        </div>
			
 
				+                        <div class="ball-three">
			
 
				+                            <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P3/ball-three.png" alt="">
			
 
				+                        </div>
			
 
				+                        <div class="yellow-three">
			
 
				+                            <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P3/yellow-three.png" alt="">
			
 
				+                        </div>
			
 
				+                        <p class="moqi">
			
 
				+                            <span class="mf">“免费看,不遮挡”的承诺</span>
			
 
				+                            <span class="mf" style="margin-top: 0.16rem;">是你我之间的永久的默契</span>
			
 
				+                        </p>
			
 
				+                        <div class="btn-next">
			
 
				+                            <div class="next-page"></div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-4">
			
 
				+                        <div class="year">
			
 
				+                            <div class="text-1">
			
 
				+                                <div class="jin">近一年</div>
			
 
				+                                <div class="day">
			
 
				+                                    <div class="ty">你登录了</div>
			
 
				+                                    <div class="days">279天</div>
			
 
				+                                    <div class="ty">剑鱼标讯</div>
			
 
				+                                </div>
			
 
				+                            </div>
			
 
				+                            <div class="sm-four">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P4/sm-four.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="fish-four">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P4/fish-four.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="big-four">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P4/big-four.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="text-2">
			
 
				+                                <div class="night">
			
 
				+                                    <div class="big-day">有138天</div>
			
 
				+                                    <div class="ty">的深夜</div>
			
 
				+                                </div>
			
 
				+                                <div class="ty" style="margin-left: 2.52rem;">仍在使用剑鱼标讯</div>
			
 
				+                            </div>
			
 
				+                            <div class="picture">
			
 
				+                                <img class="swiper-lazy" data-src="" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="text-bottom">
			
 
				+                                <div class="text-3">不是投标人爱熬夜</div>
			
 
				+                                <div class="text-3" style="margin-top: 0.16rem;">是黑夜需要投标人这颗璀璨的星</div>
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-5">
			
 
				+                        <div class="item">
			
 
				+                            <div class="this">近一年</div>
			
 
				+                            <div class="gongsi">郑州大学第一附属医院<br>LED显示屏系统</div>
			
 
				+                            <div class="guanzhu">是你最关注的项目</div>
			
 
				+                            <div class="yun-five">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P5/yun-five.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="ball-five">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P5/ball-five.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="fish-five">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P5/fish-five.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="aoyi-five"><img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P5/aoyi-five.png" alt=""></div>
			
 
				+                            <div class="text-bottom">
			
 
				+                                <p>无论结果如何，我知道</p>
			
 
				+                                <p style="margin-top: 0.16rem;">这些标讯对你来说一定有特别的意义</p>
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-6">
			
 
				+                        <div class="message">
			
 
				+                            <div class="year">近一年</div>
			
 
				+                            <div class="you">你一共浏览了</div>
			
 
				+                            <div class="num">73699条</div>
			
 
				+                            <div class="xiangmu">项目信息</div>
			
 
				+                            <div class="ball-six"><img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P6/ball-six.png" alt=""></div>
			
 
				+                            <div class="group-six"><img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P6/group-six.png" alt=""></div>
			
 
				+                            <div class="fish-six"><img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P6/fish-six.png" alt=""></div>
			
 
				+                            <div class="xd-six"><img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P6/xd-six.png" alt=""></div>
			
 
				+                            <div class="text-one">
			
 
				+                                <p>精准、及时的数据</p>
			
 
				+                                <p style="margin-top: 0.16rem;">都源于剑鱼悄悄的努力</p>
			
 
				+                            </div>
			
 
				+                            <div class="text-two">
			
 
				+                                <div class="box">
			
 
				+                                    <p class="p-one">招标信息库</p>
			
 
				+                                    <span class="s-one">9000万+</span>
			
 
				+                                    <p class="p-one">项目库</p>
			
 
				+                                    <span class="s-one">4800万+</span>
			
 
				+                                </div>
			
 
				+                                <div class="box">
			
 
				+                                    <p class="p-one">企业库</p>
			
 
				+                                    <span class="s-one">4500万+</span>
			
 
				+                                    <p class="p-one">采购单位库</p>
			
 
				+                                    <span class="s-one">200万+</span>
			
 
				+                                </div>
			
 
				+                            </div>
			
 
				+                            <div class="text-bottom">让你不遗漏任何商机</div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-7">
			
 
				+                        <div class="sum">
			
 
				+                            <div class="year">近一年</div>
			
 
				+                            <div class="you">你搜索了</div>
			
 
				+                            <div class="num">3654次</div>
			
 
				+                            <div class="xd-seven"><img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P7/xd-seven.png" alt=""></div>
			
 
				+                            <div class="text-bottom">求索力让你的成功触手可及</div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-8">
			
 
				+                        <div class="friend">
			
 
				+                            <div class="year">近一年</div>
			
 
				+                            <div class="num">765个</div>
			
 
				+                            <div class="you">企业成为你的新朋友</div>
			
 
				+                            <div class="ball-eight"><img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P8/ball-eight.png" alt=""></div>
			
 
				+                            <div class="xd-eight"><img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P8/xd-eight.png" alt=""></div>
			
 
				+                            <div class="text-bottom">
			
 
				+                                <div class="text">通过企业搜索、采购单位画像</div>
			
 
				+                                <div class="text">了解甲方、找到合作</div>
			
 
				+                                <div class="text">果断的执行力，让无数人为你痴迷</div>
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-9">
			
 
				+                        <div class="mouth">
			
 
				+                            <div class="year">
			
 
				+                                <p class="nian" style="display: contents">近一年，</p>
			
 
				+                                <span class="yue" style="color: #70EEFF;">7月</span>
			
 
				+                            </div>
			
 
				+                            <div class="you">是你最繁忙的时候</div>
			
 
				+                            <div><img class="swiper-lazy" data-src="" alt=""></div>
			
 
				+                            <div class="text-bottom">
			
 
				+                                <div class="text">或许奔波在投标路上</div>
			
 
				+                                <div class="text">或许驰骋在投标知识的海洋</div>
			
 
				+                                <div class="text">追梦的你，满怀热忱</div>
			
 
				+                            </div>
			
 
				+                            <div class="banner-yue">
			
 
				+                                <div class="banner-yue-one">7</div>
			
 
				+                                <div class="banner-yue-two">月</div>
			
 
				+                            </div>
			
 
				+                            <div class="ball-nine"><img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P9/ball-nine.png" alt=""></div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-10">
			
 
				+                        <div class="ten">
			
 
				+                            <div class="pao-ten">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P10/pao-ten.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="fish-ten">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P10/fish-ten.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="big-ten">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P10/big-ten.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="sm-ten">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P10/sm-ten.png" alt="">
			
 
				+                            </div>
			
 
				+                            <p class="year">近一年</p>
			
 
				+                            <div class="you">你关注的行业累计发布了</div>
			
 
				+                            <span class="num">3698条</span>
			
 
				+                            <div class="gonggao">项目公告</div>
			
 
				+                            <div class="text-bottom">
			
 
				+                                <div class="text">即使受到疫情的影响</div>
			
 
				+                                <div class="text">投标人依旧稳步向前</div>
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-11">
			
 
				+                        <div class="eleven">
			
 
				+                            <div class="ball-eleven">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P11/ball-eleven.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="fish-eleven">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P11/fish-eleven.png" alt="">
			
 
				+                            </div>
			
 
				+                            <p class="year">近一年</p>
			
 
				+                            <div class="you">慧眼识珠的你,体验了剑鱼</div>
			
 
				+                            <div class="gn">
			
 
				+                                <span class="num">17个</span>
			
 
				+                                <p class="new">新功能</p>
			
 
				+                            </div>
			
 
				+                            <div class="list">
			
 
				+                                <p>免费标讯搜索</p>
			
 
				+                                <p>超级订阅</p>
			
 
				+                                <p>大会员</p>
			
 
				+                                <p>数据导出</p>
			
 
				+                                <p>行业解决方案</p>
			
 
				+                                <p>......</p>
			
 
				+                            </div>
			
 
				+                            <div class="text-bottom">
			
 
				+                                <div class="text">从未枯竭的好奇心</div>
			
 
				+                                <div class="text">让你看到了更大的世界</div>
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-12">
			
 
				+                        <div class="twelve">
			
 
				+                            <div class="text">
			
 
				+                                <div class="sm-star-twelve">
			
 
				+                                    <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P12/sm-star-twelve.png" alt="">
			
 
				+                                </div>
			
 
				+                                <p class="text-1">无论好的坏的</p>
			
 
				+                                <div class="text-1" style="margin-top: 0.16rem;">跌宕且绮丽的2021已结束</div>
			
 
				+                                <div class="text-3">凛冬散尽，星河长明</div>
			
 
				+                                <div class="text-1" style="margin-top: 1.04rem;">为你生成2021年度角色报告</div>
			
 
				+                                <div class="btn">
			
 
				+                                    <div class="sc">生成报告</div>
			
 
				+                                </div>
			
 
				+                                <div class="xd-twelve">
			
 
				+                                    <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P12/xd-twelve.png" alt="">
			
 
				+                                </div>
			
 
				+                                <div class="big-star-twelve">
			
 
				+                                    <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P12/big-star-twelve.png" alt="">
			
 
				+                                </div>
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <!-- 新用户 -->
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-new-0">
			
 
				+                        <div class="new-zero">
			
 
				+                            <div class="text">
			
 
				+                                <div class="year">2021</div>
			
 
				+                                <div class="sm-zero"><img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P0/sm-zero.png" alt=""></div>
			
 
				+                                <div class="text-1">
			
 
				+                                    <p>遗憾没有和您相遇</p>
			
 
				+                                    <p>但所有的遗憾</p>
			
 
				+                                    <p>都是2022惊喜的铺垫</p>
			
 
				+                                </div>
			
 
				+                                <div class="text-2">
			
 
				+                                    <div>招免费看，不遮挡服务初心不改</div>
			
 
				+                                    <div>商机线索推荐、AI智能服务中标创新永不停歇</div>
			
 
				+                                </div>
			
 
				+                                <div class="fish-zero"><img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P0/fish-zero.png" alt=""></div>
			
 
				+                                <div class="xd-zero"><img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P0/xd-zero.png" alt=""></div>
			
 
				+                                <div class="year" style="margin-top: 3.56rem;">新的一年</div>
			
 
				+                                <div class="text-3">
			
 
				+                                    <div>期待能和你肩并肩</div>
			
 
				+                                    <div>走的更远</div>
			
 
				+                                </div>
			
 
				+                                <div class="btn">即刻体验</div>
			
 
				+                                <div class="big-zero"><img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P0/big-zero.png" alt=""></div>
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-5678-kong">
			
 
				+                        <div class="sum">
			
 
				+                            <div class="year">你可能是个慢热的人</div>
			
 
				+                            <div class="you">这一年</div>
			
 
				+                            <div class="num">还未有项目和企业成功引起你的关注</div>
			
 
				+                            <div class="text">不急，未来会有的</div>
			
 
				+                            <div class="xd-seven"><img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P7/xd-seven.png" alt=""></div>
			
 
				+                            <div class="text-bottom">点击试用一下，会有惊喜</div>
			
 
				+                            <div class="btn">试用一下</div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-10-kong">
			
 
				+                        <div class="ten">
			
 
				+                            <div class="pao-ten">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P10/pao-ten.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="fish-ten">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P10/fish-ten.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="big-ten">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P10/big-ten.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="sm-ten">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P10/sm-ten.png" alt="">
			
 
				+                            </div>
			
 
				+                            <p class="year">近一年</p>
			
 
				+                            <div class="you">你的忙碌都有了收获</div>
			
 
				+                            <div class="text-zg">
			
 
				+                                <div>通过及时的标讯信息</div>
			
 
				+                                <div style="margin-top: 0.24rem;">找合作、找甲方、找商机</div>
			
 
				+                            </div>
			
 
				+                            <div class="text-bottom">
			
 
				+                                <div class="text">即使受到疫情影响</div>
			
 
				+                                <div class="text">依旧稳步向前</div>
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-11-kong">
			
 
				+                        <div class="eleven">
			
 
				+                            <div class="ball-eleven">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P11/ball-eleven.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="fish-eleven">
			
 
				+                                <img class="swiper-lazy" data-src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/P11/fish-eleven.png" alt="">
			
 
				+                            </div>
			
 
				+                            <p class="year">近一年</p>
			
 
				+                            <div class="you">剑鱼产品不断迭代</div>
			
 
				+                            <div class="list">
			
 
				+                                <p>超级订阅V4.0</p>
			
 
				+                                <p>大会员V2.0</p>
			
 
				+                                <p>数据流量包</p>
			
 
				+                                <p>......</p>
			
 
				+                            </div>
			
 
				+                            <div class="text">期待您有更好的体验</div>
			
 
				+                            <div class="btn">试用一下</div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+        </div>
			
 
				+    </div>
			
 
				+</div>
			
 
				+
			
 
				+
			
 
				+<!--S-必定需要预加载的资源-->
			
 
				+<link rel="preload" as="script" href="https://cdn-common.jianyu360.com/cdn/lib/vue/2.6.11/vue.min.js"/>
			
 
				+<link rel="preload" as="script" href="https://cdn-common.jianyu360.com/cdn/lib/zepto/1.2.0/zepto.min.js"/>
			
 
				+<link rel="preload" as="script" href="https://cdn-common.jianyu360.com/cdn/lib/swiper/5.4.2/swiper.min.js"/>
			
 
				+<!--E-必定需要预加载的资源-->
			
 
				+<!--S-当前页面的资源-->
			
 
				+<script src="https://cdn-common.jianyu360.com/cdn/lib/swiper/5.4.2/swiper.min.js"></script>
			
 
				+<script src="https://cdn-common.jianyu360.com/cdn/lib/vue/2.6.11/vue.min.js"></script>
			
 
				+<script src="https://cdn-common.jianyu360.com/cdn/lib/jquery/3.6.0/jquery.min.js"></script>
			
 
				+
			
 
				+<!--S-提前需要预加载的资源-->
			
 
				+<link rel="prefetch" as="html" href="./result.html"/>
			
 
				+<link rel="prefetch" as="script" href="https://cdn-common.jianyu360.com/cdn/lib/html2canvas/1.1.2/dist/html2canvas.min.js"/>
			
 
				+<!--E-提前需要预加载的资源-->
			
 
				+<script>
			
 
				+
			
 
				+    function initSwiper() {
			
 
				+        var interleaveOffset = 0.5; //视差比值
			
 
				+
			
 
				+        function playAnOfIndex(index, type = true, delay = 0) {
			
 
				+            setTimeout(function () {
			
 
				+                var tempNode = $('.swiper-container .slide-inner').eq(index).find('*[animate-name]')
			
 
				+                $(tempNode).each(function () {
			
 
				+                    var anName = $(this).attr('animate-name')
			
 
				+                    var anDelay = $(this).attr('animate-delay') || '200'
			
 
				+                    if (type) {
			
 
				+                        $(this).addClass(anName)
			
 
				+                        $(this).css('animation-delay', anDelay + 'ms')
			
 
				+                    } else {
			
 
				+                        tempNode.removeClass(anName)
			
 
				+                    }
			
 
				+                })
			
 
				+            }, delay)
			
 
				+        }
			
 
				+
			
 
				+        var swiperOptions = {
			
 
				+            loop: false,
			
 
				+            speed: 1000,
			
 
				+            grabCursor: true,
			
 
				+            watchSlidesProgress: true,
			
 
				+            mousewheelControl: false,
			
 
				+            direction: 'vertical',
			
 
				+            mousewheel: true,
			
 
				+            //设置宽度为全屏
			
 
				+            width: window.innerWidth,
			
 
				+            height: window.innerHeight,
			
 
				+            allowSlideNext : false,
			
 
				+            lazy: {
			
 
				+                loadPrevNext: true,
			
 
				+            },
			
 
				+            on: {
			
 
				+                init: function () {
			
 
				+                    playAnOfIndex(0, true, 1000)
			
 
				+                },
			
 
				+                slideChangeTransitionStart: function () {
			
 
				+                    var index = this.activeIndex
			
 
				+                    playAnOfIndex(index, false)
			
 
				+                },
			
 
				+                slideChangeTransitionEnd: function () {
			
 
				+                    var index = this.activeIndex
			
 
				+                    playAnOfIndex(index)
			
 
				+                },
			
 
				+                slideChange: function () {
			
 
				+                    var index = this.activeIndex
			
 
				+                    playAnOfIndex(index)
			
 
				+                },
			
 
				+                progress: function () {
			
 
				+                    for (var i = 0; i < this.slides.length; i++) {
			
 
				+                        var slideProgress = this.slides[i].progress;
			
 
				+                        var innerOffset = this.width * interleaveOffset;
			
 
				+                        var innerTranslate = slideProgress * innerOffset;
			
 
				+                        this.slides[i].querySelector(".slide-inner").style.transform =
			
 
				+                            "translate3d(0," + innerTranslate + "px, 0)";
			
 
				+                    }
			
 
				+                },
			
 
				+                touchStart: function () {
			
 
				+                    for (var i = 0; i < this.slides.length; i++) {
			
 
				+                        this.slides[i].style.transition = "";
			
 
				+                    }
			
 
				+                },
			
 
				+                setTransition: function (speed) {
			
 
				+                    for (var i = 0; i < this.slides.length; i++) {
			
 
				+                        this.slides[i].style.transition = speed + "ms";
			
 
				+                        this.slides[i].querySelector(".slide-inner").style.transition =
			
 
				+                            speed + "ms";
			
 
				+                    }
			
 
				+                }
			
 
				+            }
			
 
				+        };
			
 
				+
			
 
				+        var swiper = new Swiper(this.$refs.mySwiper, swiperOptions);
			
 
				+        this.$swiper = swiper
			
 
				+    }
			
 
				+
			
 
				+    function initPlayMusic () {
			
 
				+        var isAutoPlayMusic = false
			
 
				+        var bgvid = document.getElementById("audio");
			
 
				+        var b_music = document.getElementById('music-control-box')
			
 
				+        var fullbox = document.querySelector('body');
			
 
				+
			
 
				+        fullbox.addEventListener('touchstart', function(){
			
 
				+            if (isAutoPlayMusic) {
			
 
				+                isAutoPlayMusic = false
			
 
				+                bgvid.play()
			
 
				+                b_music.classList.add('run-music')
			
 
				+            }
			
 
				+        }, false);
			
 
				+
			
 
				+        bgvid.addEventListener("playing", function(){
			
 
				+            b_music.style.display = 'block'
			
 
				+            b_music.classList.add('run-music')
			
 
				+        });
			
 
				+        bgvid.addEventListener("pause", function(){
			
 
				+            b_music.classList.remove('run-music')
			
 
				+        });
			
 
				+        b_music.addEventListener('click', function (e) {
			
 
				+            if (b_music.classList.contains('run-music')) {
			
 
				+                bgvid.pause()
			
 
				+                b_music.classList.remove('run-music')
			
 
				+            } else {
			
 
				+                bgvid.play()
			
 
				+                b_music.classList.add('run-music')
			
 
				+            }
			
 
				+        })
			
 
				+    }
			
 
				+
			
 
				+
			
 
				+    const pageInfo = {
			
 
				+        // 用户信息
			
 
				+        user_name: '醉纸鸢',
			
 
				+        user_head: 'https://www.jianyu360.cn/images/auto.png',
			
 
				+        share_link: 'https://www.jianyu360.cn/images/auto.png',
			
 
				+        // 是否新用户
			
 
				+        is_new: false,
			
 
				+        // 注册时间 秒
			
 
				+        registration_time: 1644249599,
			
 
				+        // 距离今天的天数
			
 
				+        total_days: 100,
			
 
				+        // 近一年登录天数
			
 
				+        login_days: 50,
			
 
				+        // 深夜登录天数
			
 
				+        active_days: -1,
			
 
				+        // 最关注的项目名称
			
 
				+        focus_project: '最关注的项目名称',
			
 
				+        // 浏览信息次数
			
 
				+        view_total: 1000,
			
 
				+        // 搜索次数
			
 
				+        search_total: 999,
			
 
				+        // 企业/项目关注数量
			
 
				+        follow_total: -1,
			
 
				+        // 繁忙月份
			
 
				+        active_month: 7,
			
 
				+        // 行业发布数据条数
			
 
				+        industry_total: 99,
			
 
				+        // 体验新功能列表
			
 
				+        exp_list: ['大会员', '超级订阅', '数据导出', '行业解决方案'],
			
 
				+        // 结果页type
			
 
				+        result: 1
			
 
				+    }
			
 
				+
			
 
				+    var vPage = new Vue({
			
 
				+        el: '.jy-report',
			
 
				+        delimiters: ['${', '}'],
			
 
				+        data: function () {
			
 
				+            return {
			
 
				+                pageInfo: pageInfo,
			
 
				+                showToastText: false,
			
 
				+                readPact: false
			
 
				+            }
			
 
				+        },
			
 
				+        created: function () {
			
 
				+
			
 
				+        },
			
 
				+        mounted: function () {
			
 
				+            initPlayMusic()
			
 
				+            initSwiper.bind(this)()
			
 
				+        },
			
 
				+        methods: {
			
 
				+            changeReadPact: function () {
			
 
				+                if (this.$swiper.activeIndex === 0 && this.readPact) {
			
 
				+                    return
			
 
				+                }
			
 
				+                this.$swiper.allowSlideNext = this.readPact
			
 
				+            },
			
 
				+            goStart: function () {
			
 
				+              if (!this.readPact) {
			
 
				+                  return this.showToast('请先阅读并同意授权协议')
			
 
				+              }
			
 
				+              this.$swiper.allowSlideNext = this.readPact
			
 
				+              this.$swiper.slideNext()
			
 
				+            },
			
 
				+            showToast: function (str, delay = 1500) {
			
 
				+                this.showToastText = str
			
 
				+                setTimeout(() => {
			
 
				+                    this.showToastText = false
			
 
				+                }, delay)
			
 
				+            }
			
 
				+        }
			
 
				+    })
			
 
				+
			
 
				+</script>
			
 
				 </body>
			
 
				-</html>
			
 
				+
			
 
				+</html>
			
--- a/src/jfw/modules/app/src/web/templates/active/yearEndReport/result.html
+++ b/src/jfw/modules/app/src/web/templates/active/yearEndReport/result.html
@@ -0,0 +1,397 @@
 
				+<!DOCTYPE html>
			
 
				+<html lang="zh-CN" style="font-size: 50px;">
			
 
				+
			
 
				+<head>
			
 
				+  <meta charset="utf-8">
			
 
				+  <meta name="keywords" content="剑鱼标讯">
			
 
				+  <meta name="description" content="剑鱼标讯">
			
 
				+  <meta name="author" content="剑鱼标讯">
			
 
				+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
			
 
				+  <meta name="viewport"
			
 
				+    content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
			
 
				+  <meta name="x5-page-mode" content="app">
			
 
				+  <meta name="apple-mobile-web-app-capable" content="yes">
			
 
				+  <meta name="apple-mobile-web-app-status-bar-style" content="black">
			
 
				+  <meta name="format-detection" content="telephone=no">
			
 
				+  <meta name="referrer" content="no-referrer">
			
 
				+  <link rel="icon" href="/favicon.ico">
			
 
				+  <title>年度报告</title>
			
 
				+  <link rel="preload" as="style" href="https://cdn-common.jianyu360.com/cdn/lib/reset-css/5.0.1/reset.min.css" />
			
 
				+  <link rel="stylesheet" href="https://cdn-common.jianyu360.com/cdn/lib/reset-css/5.0.1/reset.min.css" />
			
 
				+  <link rel="stylesheet" href="//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/index.css">
			
 
				+  <link rel="stylesheet" href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/css/music.css">
			
 
				+  <link rel="stylesheet" href="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/css/result.css">
			
 
				+</head>
			
 
				+
			
 
				+<body>
			
 
				+  <div id="result" class="mask-report" v-cloak>
			
 
				+    <!-- S--MUSIC -->
			
 
				+    <audio id="audio" controls loop src='https://www.jianyu360.cn/big-member/video/music.mp3' autoplay></audio>
			
 
				+    <div id="music-control-box" v-if="!picImgStatus">
			
 
				+      <div class="music-icon-box">
			
 
				+        <img class="icon-music-on" src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/music/music.png' />
			
 
				+        <img class="icon-music-off" src='{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/music/music-off.png' />
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <!-- E--MUSIC -->
			
 
				+    <div class="jy-report result" ref="resultRefs">
			
 
				+    <!-- 结果1、2背景的装饰 -->
			
 
				+    <div class="ball" v-if="curRole._id == 1">
			
 
				+      <img src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/ball.png" alt="">
			
 
				+    </div>
			
 
				+    <div class="star" v-if="curRole._id == 2">
			
 
				+      <img src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/star.png" alt="">
			
 
				+    </div>
			
 
				+    <div class="r-content">
			
 
				+      <div class="info">
			
 
				+        <div class="user">
			
 
				+          <div class="head-img">
			
 
				+            <img src="https://cdn-ali.jianyu360.com/images/appext/fixed-sm.jpg" alt="">
			
 
				+          </div>
			
 
				+          <div class="nick-name">Wind</div>
			
 
				+        </div>
			
 
				+        <div class="role">
			
 
				+          <div class="role-placeholder">您的年度角色是</div>
			
 
				+          <div class="role-title">${curRole.title}</div>
			
 
				+          <div class="role-main">
			
 
				+            <p class="role-text">跨过遗憾 跨过不甘。2022年，你会</p>
			
 
				+            <div class="role-label">
			
 
				+              <img :src="curRole.label" alt="">
			
 
				+            </div>
			
 
				+          </div>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+      <!-- <div class="role-bg" :class="[{'role-bg-1': curRole._id == 1,'role-bg-2': curRole._id == 2, 'role-bg-other': curRole._id > 2}]">
			
 
				+        <img :src='curRole.bg' alt="">
			
 
				+      </div> -->
			
 
				+      <div class="role-bg role-bg-other">
			
 
				+        <img :src='curRole.bg' alt="">
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <!-- 按钮 -->
			
 
				+    <div class="r-btns" v-if="!picImgStatus" key="status">
			
 
				+      <button v-show="!isWeiXinBrowser" type="button" class="share-btn" @click.prevent="shareFn">去分享</button>
			
 
				+      <button type="button" class="create-btn" @click.prevent="createImgFn">生成海报</button>
			
 
				+    </div>
			
 
				+    <!-- 底部二维码 -->
			
 
				+    <div class="r-bottom" v-else key="status">
			
 
				+       <div class="jy-logo">
			
 
				+        <img src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/jy-logo.png" alt="">
			
 
				+       </div>
			
 
				+       <div class="jy-qcode">
			
 
				+         <div class="code-label">
			
 
				+          <p>扫一扫</p>
			
 
				+          <p style="line-height: .3rem;">看看你的年度角色</p>
			
 
				+         </div>
			
 
				+         <div class="code-img">
			
 
				+           <img src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/jy-qcode.png" alt="">
			
 
				+         </div>
			
 
				+       </div>
			
 
				+    </div>
			
 
				+    <van-action-sheet
			
 
				+      v-model="showAction"
			
 
				+      :actions="actions"
			
 
				+      cancel-text="取消"
			
 
				+      close-on-click-action
			
 
				+      @select="selectShare"
			
 
				+    ></van-action-sheet>
			
 
				+  </div>
			
 
				+</div>
			
 
				+  <!--S-必定需要预加载的资源-->
			
 
				+  <link rel="preload" as="script" href="https://cdn-common.jianyu360.com/cdn/lib/vue/2.6.11/vue.min.js" />
			
 
				+  <link rel="preload" as="script" href="https://cdn-common.jianyu360.com/cdn/lib/zepto/1.2.0/zepto.min.js" />
			
 
				+  <!--E-必定需要预加载的资源-->
			
 
				+  <!--S-当前页面的资源-->
			
 
				+  <script src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/js/rem.js"></script>
			
 
				+  <script src="https://cdn-common.jianyu360.com/cdn/lib/vue/2.6.11/vue.min.js"></script>
			
 
				+  <script src=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/vant.min.js></script>
			
 
				+  <script src="https://cdn-common.jianyu360.com/cdn/lib/zepto/1.2.0/zepto.min.js"></script>
			
 
				+  <script src="https://cdn-common.jianyu360.com/cdn/lib/html2canvas/1.1.2/dist/html2canvas.min.js"></script>
			
 
				+  <script src=//res2.wx.qq.com/open/js/jweixin-1.6.0.js></script>
			
 
				+  <script src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/js/common.js"></script>
			
 
				+  <!-- 使用html2canvas 生成图片dom层不能使用背景图 否则生成的图片会模糊 且无法修复 -->
			
 
				+  <script>
			
 
				+    function initPlayMusic () {
			
 
				+      var isAutoPlayMusic = false
			
 
				+      var bgvid = document.getElementById("audio");
			
 
				+      var b_music = document.getElementById('music-control-box')
			
 
				+      var fullbox = document.querySelector('body');
			
 
				+
			
 
				+      fullbox.addEventListener('touchstart', function(){
			
 
				+        if (isAutoPlayMusic) {
			
 
				+          isAutoPlayMusic = false
			
 
				+          bgvid.play()
			
 
				+          b_music.classList.add('run-music')
			
 
				+        }
			
 
				+      }, false);
			
 
				+
			
 
				+      bgvid.addEventListener("playing", function(){
			
 
				+        b_music.style.display = 'block'
			
 
				+        b_music.classList.add('run-music')
			
 
				+      });
			
 
				+      bgvid.addEventListener("pause", function(){
			
 
				+        b_music.classList.remove('run-music')
			
 
				+      });
			
 
				+      b_music.addEventListener('click', function (e) {
			
 
				+        if (b_music.classList.contains('run-music')) {
			
 
				+          bgvid.pause()
			
 
				+          b_music.classList.remove('run-music')
			
 
				+        } else {
			
 
				+          bgvid.play()
			
 
				+          b_music.classList.add('run-music')
			
 
				+        }
			
 
				+      })
			
 
				+    }
			
 
				+    var result = new Vue({
			
 
				+      el: '#result',
			
 
				+      delimiters: ['${', '}'],
			
 
				+      data: function() {
			
 
				+        return {
			
 
				+          resultList: [
			
 
				+            {_id: '1', title: '逢标必中的投标达人', label: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/label-1.png', bg: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/item-bg-1.png'},
			
 
				+            {_id: '2', title: '成功触手可及的追梦人', label: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/label-2.png', bg: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/item-bg-2.png'},
			
 
				+            {_id: '3', title: '怀抱热振元气满满的打工人', label: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/label-3.png', bg: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/item-bg-3.png'},
			
 
				+            {_id: '4', title: '日进斗金的大佬', label: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/label-4.png', bg: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/item-bg-4.png'},
			
 
				+            {_id: '5', title: '有钱任性的大BOSS', label: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/label-5.png', bg: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/item-bg-5.png'},
			
 
				+            {_id: '6', title: '开疆拓土的“顶梁柱”', label: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/label-6.png', bg: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/item-bg-6.png'},
			
 
				+            {_id: '7', title: '炉火纯青的盖章无影手', label: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/label-7.png', bg: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/item-bg-7.png'},
			
 
				+            {_id: '8', title: '有钱任性的大BOSS', label: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/label-8.png', bg: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/item-bg-5.png'},
			
 
				+            {_id: '9', title: '有钱任性的大BOSS', label: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/label-9.png', bg: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/item-bg-5.png'},
			
 
				+          ],
			
 
				+          curRole: {
			
 
				+            _id: '1',
			
 
				+            title: '逢标必中的投标达人',
			
 
				+            label: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/label-1.png',
			
 
				+            bg: '{{Cdns .Host "seo" "cdn"|SafeUrl}}/common-module/yearEndReport/images/result/item-bg-1.png'
			
 
				+          },
			
 
				+          picImgStatus: false,
			
 
				+          showAction: false,
			
 
				+          actions: [{ name: '微信' }, { name: '朋友圈' }],
			
 
				+          wxSDKSign: {
			
 
				+            debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印
			
 
				+            appId: '', // 必填，公众号的唯一标识
			
 
				+            timestamp: '', // 必填，生成签名的时间戳
			
 
				+            nonceStr: '', // 必填，生成签名的随机串
			
 
				+            signature: '',// 必填，签名
			
 
				+            jsApiList: [
			
 
				+                // 自定义“分享给朋友”及“分享到QQ”按钮的分享内容
			
 
				+                'updateAppMessageShareData',
			
 
				+                // 自定义“分享到朋友圈”及“分享到QQ空间”按钮的分享内容
			
 
				+                'updateTimelineShareData',
			
 
				+                // 获取“分享到腾讯微博”按钮点击状态及自定义分享内容接口
			
 
				+                'onMenuShareWeibo',
			
 
				+                // 关闭当前网页窗口接口
			
 
				+                'closeWindow',
			
 
				+                // 批量隐藏功能按钮接口
			
 
				+                // 'hideMenuItems',
			
 
				+                // 批量显示功能按钮接口
			
 
				+                // 'showMenuItems',
			
 
				+                // 隐藏所有非基础按钮接口
			
 
				+                // 'hideAllNonBaseMenuItem',
			
 
				+                // 显示所有功能按钮接口
			
 
				+                // 'showAllNonBaseMenuItem',
			
 
				+                // 调起微信扫一扫接口
			
 
				+                // 'scanQRCode'
			
 
				+            ],
			
 
				+            openTagList: ['wx-open-launch-app']
			
 
				+          },
			
 
				+          shareInfo: {
			
 
				+            title: '剑鱼标讯',
			
 
				+            desc: '我的剑鱼标讯2021」年度报告已经生成，请查收',
			
 
				+            link: location.href.split('?')[0],
			
 
				+            imgUrl: 'https://cdn-ali.jianyu360.com/images/appext/fixed-sm.jpg'
			
 
				+          },
			
 
				+        }
			
 
				+      },
			
 
				+      computed: {
			
 
				+        isWeiXinBrowser: function () {
			
 
				+          return utils.isWeiXinBrowser
			
 
				+        }
			
 
				+      },
			
 
				+      mounted() {
			
 
				+        initPlayMusic()
			
 
				+        // 微信端注册sdk
			
 
				+        if (utils.isWeiXinBrowser) {
			
 
				+          this.getWxSdkSign()
			
 
				+        }
			
 
				+        var list = this.resultList
			
 
				+        var _this = this
			
 
				+        list.forEach(function(item){
			
 
				+          if (item._id == utils.getParam('type')) {
			
 
				+            _this.curRole._id = item._id
			
 
				+            _this.curRole.title = item.title
			
 
				+            _this.curRole.label = item.label
			
 
				+            _this.curRole.bg = item.bg
			
 
				+          }
			
 
				+        })
			
 
				+      },
			
 
				+      methods: {
			
 
				+        showLoading: function (msg) {
			
 
				+          const loading = this.$toast.loading({
			
 
				+            duration: 0,
			
 
				+            forbidClick: true,
			
 
				+            message: msg || '图片生成中...',
			
 
				+          })
			
 
				+          return loading
			
 
				+        },
			
 
				+        changeStyle: function () {
			
 
				+          var rWidth = ($('.result').width())*2
			
 
				+          var rHeight = ($('.result').height())*2
			
 
				+          var padLeft = (rWidth - 750 ) / 2
			
 
				+          var padTop = (rHeight - 1448 ) / 2
			
 
				+          $('.mask-report').addClass('mask-report-active')
			
 
				+          $('.result').css({
			
 
				+            "padding": '0.64rem 0',
			
 
				+            "background-position": '-40px -40px',
			
 
				+            "background-size": "110% 110%"
			
 
				+
			
 
				+          })
			
 
				+          $('.r-content').css({
			
 
				+            "padding": '0 ' +  + padLeft/2 + 'px'
			
 
				+          })
			
 
				+          $('.role-bg').css({
			
 
				+            "width": "8.48rem",
			
 
				+            "left": "-41px"
			
 
				+          })
			
 
				+          $('.info').css({
			
 
				+            "width": "6.88rem"
			
 
				+          })
			
 
				+          $('.role-main').css({
			
 
				+            "padding": "0.48rem .54rem"
			
 
				+          })
			
 
				+          $(".role-text").css({
			
 
				+            "font-size": '0.36rem'
			
 
				+          })
			
 
				+          $('.r-bottom').css({
			
 
				+            padding: '0 0.3rem'
			
 
				+          })
			
 
				+        },
			
 
				+        // html2canvas方法
			
 
				+        covertToImage: function(container, options = {}) {
			
 
				+          // 设置放大倍数
			
 
				+          var scale = window.devicePixelRatio
			
 
				+          // 传入节点原始宽高
			
 
				+          var _width = container.offsetWidth
			
 
				+          var _height = container.offsetHeight
			
 
				+          let { width, height } = options
			
 
				+          width = width || _width
			
 
				+          height = height || _height
			
 
				+          var ops = {
			
 
				+            dpi: 300,
			
 
				+            scale,
			
 
				+            async: false,
			
 
				+            useCORS: true,
			
 
				+            // scrollX: 20,
			
 
				+            // scrollY: 20,
			
 
				+            allowTaint: false,
			
 
				+            backgroundColor: null, // 避免图片有白色边框
			
 
				+            ...options
			
 
				+          };
			
 
				+          return html2canvas(container, ops).then(function(canvas) {
			
 
				+            // 返回图片的二进制数据
			
 
				+            var url = canvas.toDataURL("image/png");
			
 
				+            return url
			
 
				+          })
			
 
				+        },
			
 
				+        // app端微信、朋友圈分享方法
			
 
				+        selectShare: function(e) {
			
 
				+          var shareTitle = '我的剑鱼标讯2021年度报告已经生成，请查收'
			
 
				+          var content = ''
			
 
				+          var link = window.location.href
			
 
				+          if (e.name == '微信') {
			
 
				+            try {
			
 
				+              JyObj.share(1,shareTitle,content,link);
			
 
				+            } catch (error) {}
			
 
				+          } else if (e.name == '朋友圈') {
			
 
				+            try {
			
 
				+              JyObj.share(3,shareTitle,content,link);
			
 
				+            } catch (error) {}
			
 
				+          }
			
 
				+        },
			
 
				+        // 取用户appid、签名等
			
 
				+        getWxSdkSign: function() {
			
 
				+          var _this = this
			
 
				+          $.ajax({
			
 
				+            url: '/jypay/wx/getwxSdkSign',
			
 
				+            type: 'POST',
			
 
				+            data: {
			
 
				+              url: location.href.split('#')[0]
			
 
				+            },
			
 
				+            success: function (res) {
			
 
				+              if (res && res.wxsdk && $.isArray(res.wxsdk)) {
			
 
				+                _this.wxSDKSign.appId = res.wxsdk[0]
			
 
				+                _this.wxSDKSign.timestamp = res.wxsdk[1]
			
 
				+                _this.wxSDKSign.nonceStr = res.wxsdk[2]
			
 
				+                _this.wxSDKSign.signature = res.wxsdk[3]
			
 
				+                _this.registerWxSDK()
			
 
				+              }
			
 
				+            },
			
 
				+            complete: function () {},
			
 
				+            error: function () {}
			
 
				+          })
			
 
				+        },
			
 
				+        // 注册微信sdk方法
			
 
				+        registerWxSDK: function () {
			
 
				+          var _this = this
			
 
				+          var extInfo = {
			
 
				+            url: 'jianyu360.com'
			
 
				+          }
			
 
				+          // 微信sdk注册
			
 
				+          wx.config(this.wxSDKSign)
			
 
				+          wx.error(function(err){
			
 
				+            console.log(err);
			
 
				+          })
			
 
				+          wx.ready(function (res) {
			
 
				+            // 自定义“分享给朋友”及“分享到QQ”按钮的分享内容
			
 
				+            wx.updateAppMessageShareData(_this.shareInfo)
			
 
				+            // 自定义“分享到朋友圈”及“分享到QQ空间”按钮的分享内容
			
 
				+            wx.updateTimelineShareData(_this.shareInfo)
			
 
				+            // onMenuShareWeibo
			
 
				+            wx.onMenuShareWeibo(_this.shareInfo)
			
 
				+          })
			
 
				+        },
			
 
				+        // 点击去分享
			
 
				+        shareFn: function () {
			
 
				+          if (utils.isWeiXinBrowser) {
			
 
				+            // 微信端使用自带分享
			
 
				+          } else {
			
 
				+            // app 使用客户端方法分享
			
 
				+            this.showAction = true
			
 
				+          }
			
 
				+        },
			
 
				+        // 点击生成海报
			
 
				+        createImgFn: function () {
			
 
				+          var loading = this.showLoading()
			
 
				+          $(".canvas-img").remove()
			
 
				+          this.picImgStatus = true
			
 
				+          if (this.picImgStatus) {
			
 
				+            var _this = this
			
 
				+            _this.changeStyle() // 生成图片前 先改变页面样式
			
 
				+            setTimeout(function() {
			
 
				+              var data = _this.covertToImage(_this.$refs.resultRefs)
			
 
				+              data.then(function(url) {
			
 
				+                loading.clear()
			
 
				+                $("body").append('<div class="canvas"><img class="canvas-img" src='+ url + '></div>')
			
 
				+                if (utils.isWeiXinBrowser) {
			
 
				+                  $("body").append('<img class="canvas-img" src='+ url + '>')
			
 
				+                } else {
			
 
				+                  // 调用客户端保存图片方法
			
 
				+                  try {
			
 
				+                    window.JyObj.savePic(url)
			
 
				+                  } catch (err) {
			
 
				+                    console.log(err);
			
 
				+                  }
			
 
				+                }
			
 
				+              }).catch(function(err) {
			
 
				+                console.log(err);
			
 
				+                _this.$toast('图片生成失败')
			
 
				+              })
			
 
				+            }, 500)
			
 
				+          }
			
 
				+        }
			
 
				+      }
			
 
				+    })
			
 
				+  </script>
			
 
				+</body>
			
 
				+
			
 
				+</html>
			
--- a/src/web/staticres/common-module/yearEndReport/css/index.css
+++ b/src/web/staticres/common-module/yearEndReport/css/index.css
@@ -0,0 +1,1834 @@
 
				+@charset "UTF-8";
			
 
				+
			
 
				+
			
 
				+[v-cloak] {
			
 
				+  opacity: 0;
			
 
				+}
			
 
				+
			
 
				+body {
			
 
				+  background: #eee;
			
 
				+  font-family: PingFang SC-Medium, PingFang SC, Helvetica Neue, Helvetica, Arial, sans-serif;
			
 
				+  font-size: 0.28rem;
			
 
				+  color: #000;
			
 
				+  margin: 0;
			
 
				+  padding: 0;
			
 
				+}
			
 
				+
			
 
				+.swiper-slide {
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+
			
 
				+.swiper-container, .report-page {
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+.jy-report {
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  position: absolute;
			
 
				+  top: 0;
			
 
				+  left: 0;
			
 
				+  background: url(../images/BG/bg.png) no-repeat center center;
			
 
				+  background-size: 9.5rem 100%;
			
 
				+  background-position: 0 0;
			
 
				+}
			
 
				+
			
 
				+.slide-inner {
			
 
				+  position: absolute;
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  left: 0;
			
 
				+  top: 0;
			
 
				+  background-size: cover;
			
 
				+  background-position: center;
			
 
				+  display: -webkit-box;
			
 
				+  display: -ms-flexbox;
			
 
				+  display: -webkit-flex;
			
 
				+  display: flex;
			
 
				+  -webkit-box-pack: center;
			
 
				+  -ms-flex-pack: center;
			
 
				+  -webkit-justify-content: center;
			
 
				+  justify-content: center;
			
 
				+  -webkit-box-align: center;
			
 
				+  -ms-flex-align: center;
			
 
				+  -webkit-align-items: center;
			
 
				+  align-items: center;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+
			
 
				+.next-page {
			
 
				+  position: absolute;
			
 
				+  bottom: 0.72rem;
			
 
				+  width: 0.64rem;
			
 
				+  height: 0.52rem;
			
 
				+  background: url(../images/next/next.png) no-repeat center center;
			
 
				+  background-size: 0.64rem 0.52rem;
			
 
				+  animation: LoopPlayback 2s infinite ease-in;
			
 
				+}
			
 
				+
			
 
				+
			
 
				+
			
 
				+
			
 
				+.go-button {
			
 
				+  position: relative;
			
 
				+  width: 4.56rem;
			
 
				+  height: 0.96rem;
			
 
				+  text-align: center;
			
 
				+  background: linear-gradient(180deg, #57FFF5 0%, #FFFFFF 100%);
			
 
				+  box-shadow: 0px 0.08rem 0.32rem 1px rgba(8, 31, 38, 0.08);
			
 
				+  font-size: 0.4rem;
			
 
				+  line-height: 0.96rem;
			
 
				+  font-weight: bold;
			
 
				+  color: #10616B;
			
 
				+  letter-spacing: 0.06rem;
			
 
				+  border-radius: 0.48rem;
			
 
				+}
			
 
				+.go-button::after {
			
 
				+  content: "";
			
 
				+  position: absolute;
			
 
				+  top: 0.08rem;
			
 
				+  left: 0;
			
 
				+  z-index: -1;
			
 
				+  display: inline-block;
			
 
				+  width: 4.56rem;
			
 
				+  height: 0.96rem;
			
 
				+  border-radius: 0.48rem;
			
 
				+  background: linear-gradient(180deg, #FFFFFF 0%, #57FFF5 100%);
			
 
				+  box-shadow: 0rem 0.08rem 0.32rem 0.02rem rgba(8, 31, 38, 0.08);
			
 
				+}
			
 
				+.jy-toast {
			
 
				+  position: fixed;
			
 
				+  top: 50%;
			
 
				+  left: 50%;
			
 
				+  display: -webkit-box;
			
 
				+  display: -webkit-flex;
			
 
				+  display: flex;
			
 
				+  -webkit-box-orient: vertical;
			
 
				+  -webkit-box-direction: normal;
			
 
				+  -webkit-flex-direction: column;
			
 
				+  flex-direction: column;
			
 
				+  -webkit-box-align: center;
			
 
				+  -webkit-align-items: center;
			
 
				+  align-items: center;
			
 
				+  -webkit-box-pack: center;
			
 
				+  -webkit-justify-content: center;
			
 
				+  justify-content: center;
			
 
				+  box-sizing: content-box;
			
 
				+  max-width: 70%;
			
 
				+  color: #fff;
			
 
				+  font-size: 14px;
			
 
				+  line-height: 20px;
			
 
				+  white-space: pre-wrap;
			
 
				+  text-align: center;
			
 
				+  word-break: break-all;
			
 
				+  background-color: rgba(0,0,0,.7);
			
 
				+  border-radius: 8px;
			
 
				+  -webkit-transform: translate3d(-50%,-50%,0);
			
 
				+  transform: translate3d(-50%,-50%,0);
			
 
				+  pointer-events: none;
			
 
				+  min-width: 96px;
			
 
				+  min-height: 0;
			
 
				+  padding: 8px 12px;
			
 
				+}
			
 
				+
			
 
				+/* S 动画 */
			
 
				+@keyframes FadeIn {
			
 
				+  0% {
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+  100% {
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+}
			
 
				+@keyframes LoopPlayback {
			
 
				+  0% {
			
 
				+    opacity: 0;
			
 
				+    transform: translateY(30%);
			
 
				+  }
			
 
				+  80% {
			
 
				+    transform: translateY(0);
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+  100% {
			
 
				+    opacity: 0.2;
			
 
				+    transform: translateY(-30%);
			
 
				+  }
			
 
				+}
			
 
				+@keyframes InitMeteorBgIn {
			
 
				+  from {
			
 
				+    transform: scale(4) translate3d(0, -20%, 0) rotate3d(1, 1, 1, 20deg);
			
 
				+  }
			
 
				+  to {
			
 
				+    transform: unset;
			
 
				+  }
			
 
				+}
			
 
				+@keyframes Flicker {
			
 
				+  0% {
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+  15% {
			
 
				+    opacity: 0.6;
			
 
				+  }
			
 
				+  40% {
			
 
				+    opacity: 0.3;
			
 
				+  }
			
 
				+  70% {
			
 
				+    opacity: 0.8;
			
 
				+  }
			
 
				+  90% {
			
 
				+    opacity: 0.92;
			
 
				+  }
			
 
				+  100% {
			
 
				+    opacity: 0.7;
			
 
				+  }
			
 
				+}
			
 
				+@keyframes LeftMeteorIn {
			
 
				+  0% {
			
 
				+    transform-origin: 50% 500px;
			
 
				+    transform: rotate(-30deg);
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+  90% {
			
 
				+    transform: unset;
			
 
				+    opacity: 0.8;
			
 
				+  }
			
 
				+  100% {
			
 
				+    transform: unset;
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+}
			
 
				+@keyframes MeteorIn {
			
 
				+  from {
			
 
				+    transform: rotate(-10deg) translateX(-50%);
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+  to {
			
 
				+    transform: unset;
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+}
			
 
				+@keyframes FadeBottomIn {
			
 
				+  from {
			
 
				+    transform: translateY(60%);
			
 
				+    opacity: 0;
			
 
				+  }
			
 
				+  to {
			
 
				+    transform: unset;
			
 
				+    opacity: 1;
			
 
				+  }
			
 
				+}
			
 
				+*[animate-name='up'] {
			
 
				+  opacity: 0;
			
 
				+}
			
 
				+*[animate-name].up{
			
 
				+  animation: FadeBottomIn 1s ease forwards;
			
 
				+}
			
 
				+
			
 
				+/* E 动画 */
			
 
				+
			
 
				+/* S 第一页 */
			
 
				+.page-1 {
			
 
				+  display: flex;
			
 
				+  flex-direction: column;
			
 
				+  align-items: center;
			
 
				+}
			
 
				+.page-1 .jy-user-name {
			
 
				+  font-size: 0.48rem;
			
 
				+  font-weight: 500;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.36rem;
			
 
				+}
			
 
				+
			
 
				+.page-1 .jy-user-name span + span {
			
 
				+  margin-left: 0.16rem;
			
 
				+}
			
 
				+
			
 
				+.page-1 .user-info-group {
			
 
				+  margin-top: 2.72rem;
			
 
				+  display: flex;
			
 
				+  flex-direction: column;
			
 
				+  align-items: center;
			
 
				+}
			
 
				+
			
 
				+.page-1 .jy-user-img {
			
 
				+  width: 1.44rem;
			
 
				+  height: 1.44rem;
			
 
				+  border: 1px solid rgba(0, 0, 0, 0.1);
			
 
				+  margin-bottom: 0.32rem;
			
 
				+}
			
 
				+
			
 
				+.page-1 .jy-logo {
			
 
				+  position: absolute;
			
 
				+  bottom: 2.28rem;
			
 
				+  width: 2.28rem;
			
 
				+  height: 0.6rem;
			
 
				+}
			
 
				+
			
 
				+.page-1 .go-report {
			
 
				+  position: absolute;
			
 
				+  bottom: 4rem;
			
 
				+}
			
 
				+
			
 
				+.page-1 .tip-info {
			
 
				+  margin-top: 1.28rem;
			
 
				+  font-size: 0.48rem;
			
 
				+  font-weight: bold;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.36rem;
			
 
				+  letter-spacing: 0.14rem;
			
 
				+}
			
 
				+
			
 
				+.page-1 .text-hello {
			
 
				+  font-size: 0.32rem;
			
 
				+  font-weight: 500;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.36rem;
			
 
				+  letter-spacing: 0.08rem;
			
 
				+  margin-bottom: 0.32rem;
			
 
				+  margin-left: 0.46rem;
			
 
				+  display: block;
			
 
				+}
			
 
				+
			
 
				+.page-1 .read_pact input:checked {
			
 
				+  background-color: #2ABED1;
			
 
				+}
			
 
				+.page-1 .read_pact input {
			
 
				+  width: 0.3rem;
			
 
				+  height: 0.3rem;
			
 
				+  background: transparent;
			
 
				+  margin: 0;
			
 
				+  margin-right: 0.2rem;
			
 
				+  border-radius: 50%;
			
 
				+  vertical-align: middle;
			
 
				+  border: 1px solid #fff;
			
 
				+  appearance: none;
			
 
				+  -webkit-appearance: none;
			
 
				+  outline: none;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+.page-1 .read_pact a {
			
 
				+  color: #2ABED1;
			
 
				+  text-decoration: none;
			
 
				+}
			
 
				+.page-1 .read_pact {
			
 
				+  position: absolute;
			
 
				+  bottom: 6.4rem;
			
 
				+  font-size: 0.26rem;
			
 
				+  font-weight: 500;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.36rem;
			
 
				+  display: flex;
			
 
				+  flex-direction: row;
			
 
				+  align-items: center;
			
 
				+}
			
 
				+
			
 
				+.page-1 .add-layer-group {
			
 
				+  position: absolute;
			
 
				+  left: 0;
			
 
				+  top: 0;
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  z-index: -99;
			
 
				+}
			
 
				+
			
 
				+.page-1 .meteor-bg {
			
 
				+  position: absolute;
			
 
				+  bottom: 0;
			
 
				+  width: 100%;
			
 
				+  animation: InitMeteorBgIn 1.2s ease-in;
			
 
				+}
			
 
				+
			
 
				+.page-1 .meteor-mini {
			
 
				+  position: absolute;
			
 
				+  top: 3.4rem;
			
 
				+  left: 6.82rem;
			
 
				+  width: 1.36rem;
			
 
				+  height: 0.77rem;
			
 
				+  animation: Flicker infinite 2s  ease;
			
 
				+}
			
 
				+
			
 
				+.page-1 .meteor-left {
			
 
				+  position: absolute;
			
 
				+  top: 4.52rem;
			
 
				+  width: 3.34rem;
			
 
				+  height: 1.14rem;
			
 
				+  animation: LeftMeteorIn 1.2s 0.8s ease-in-out;
			
 
				+}
			
 
				+
			
 
				+/* E 第一页 */
			
 
				+
			
 
				+/* S 第二页 */
			
 
				+.page-2 .meet{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  margin-top: 2.92rem;
			
 
				+}
			
 
				+.page-2 .hello{
			
 
				+font-size: 0.48rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.56rem;
			
 
				+letter-spacing: 7px;
			
 
				+margin-left: 1.54rem;
			
 
				+}
			
 
				+.page-2 .text{
			
 
				+  font-size: .32rem;
			
 
				+  font-family: PingFang SC-Regular, PingFang SC;
			
 
				+  font-weight: 400;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: .36rem;
			
 
				+  letter-spacing: .08rem;
			
 
				+}
			
 
				+.page-2 .text-a{
			
 
				+  font-size: 0.28rem;
			
 
				+  font-family: PingFang SC-Regular, PingFang SC;
			
 
				+  font-weight: 400;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.36rem;
			
 
				+  letter-spacing: 4px;
			
 
				+  margin-left: 1.54rem;
			
 
				+}
			
 
				+.page-2 .time{
			
 
				+  font-size: .32rem;
			
 
				+  font-family: PingFang SC-Bold, PingFang SC;
			
 
				+  font-weight: bold;
			
 
				+  color: #70EEFF;
			
 
				+  line-height: .36rem;
			
 
				+  letter-spacing: .08rem;
			
 
				+}
			
 
				+.page-2 .star-two{
			
 
				+  position: absolute;
			
 
				+  top: 5rem;
			
 
				+  right: 1.48rem;
			
 
				+  width: 1.36rem;
			
 
				+  height: 0.77rem;
			
 
				+}
			
 
				+.page-2 .star-two img{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+.page-2 .fish-two{
			
 
				+  position: absolute;
			
 
				+  right: 2.28rem;
			
 
				+  bottom: 6.98rem;
			
 
				+  width: 2.39rem;
			
 
				+  height: 1.66rem;
			
 
				+}
			
 
				+.page-2 .fish-two img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+.page-2 .tail-two{
			
 
				+  position: absolute;
			
 
				+  bottom: 6.2rem;
			
 
				+  right:2.2rem;
			
 
				+  z-index: -8;
			
 
				+}
			
 
				+.page-2 .tail-two img{
			
 
				+  width: 100%;
			
 
				+
			
 
				+}
			
 
				+.page-2 .btn-next{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+}
			
 
				+.page-2 .ball-two{
			
 
				+  width: 100%;
			
 
				+  position: absolute;
			
 
				+  bottom: 0;
			
 
				+  right: 0;
			
 
				+  z-index: -9;
			
 
				+}
			
 
				+/* E第二页 */
			
 
				+
			
 
				+/* S第三页 */
			
 
				+.page-3{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+  flex-direction: column;
			
 
				+}
			
 
				+.page-3 .usage-days{
			
 
				+  display: flex;
			
 
				+  flex-direction: column;
			
 
				+  margin-top: 2.92rem;
			
 
				+}
			
 
				+.page-3 .today{
			
 
				+font-size: 0.48rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.56rem;
			
 
				+letter-spacing: 7px;
			
 
				+position: absolute;
			
 
				+top: 2.92rem;
			
 
				+left: 1.5rem;
			
 
				+}
			
 
				+.page-3 .text{
			
 
				+  font-size: .32rem;
			
 
				+  font-family: PingFang SC-Regular, PingFang SC;
			
 
				+  font-weight: 400;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: .36rem;
			
 
				+  letter-spacing: .08rem;
			
 
				+  position: absolute;
			
 
				+  top: 3.92rem;
			
 
				+  left: 1.5rem;
			
 
				+}
			
 
				+.page-3 .days{
			
 
				+  font-size: .48rem;
			
 
				+  font-family: PingFang SC-Bold, PingFang SC;
			
 
				+  font-weight: bold;
			
 
				+  color: #70EEFF;
			
 
				+  line-height: .56rem;
			
 
				+  letter-spacing: .14rem;
			
 
				+  position: absolute;
			
 
				+    top: 4.3rem;
			
 
				+    right: 1.36rem;
			
 
				+}
			
 
				+.page-3 .star-three{
			
 
				+  position: absolute;
			
 
				+  top: 5rem;
			
 
				+  left: 1.84rem;
			
 
				+  width: 1.36rem;
			
 
				+  height: 0.77rem;
			
 
				+}
			
 
				+.page-3 .star-three img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+.page-3 .yellow-three{
			
 
				+  position: absolute;
			
 
				+  top: 6.7rem;
			
 
				+  left: 1.8rem;
			
 
				+  width: 2.48rem;
			
 
				+  z-index: -9;
			
 
				+}
			
 
				+.page-3 .yellow-three img{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+.page-3 .ball-three{
			
 
				+  position: absolute;
			
 
				+  bottom: 0;
			
 
				+  left: 0;
			
 
				+  z-index: -1;
			
 
				+}
			
 
				+.page-3 .ball-three img{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+.page-3 .btn-next{
			
 
				+  margin-top: 8.46rem;
			
 
				+}
			
 
				+.page-3 .moqi{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  flex-direction: column;
			
 
				+  justify-content: center;
			
 
				+  position: absolute;
			
 
				+  bottom: 1.92rem;
			
 
				+}
			
 
				+.page-3 .mf{
			
 
				+  font-size: .28rem;
			
 
				+  font-family: PingFang SC-Regular, PingFang SC;
			
 
				+  font-weight: 400;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: .36rem;
			
 
				+  letter-spacing: .08rem;
			
 
				+}
			
 
				+.page-3 .btn-next{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  flex-direction: column;
			
 
				+}
			
 
				+/* E第三页 */
			
 
				+
			
 
				+/* S第四页 */
			
 
				+.page-4{
			
 
				+  display: flex;
			
 
				+  justify-content: center;
			
 
				+}
			
 
				+.page-4 .year{
			
 
				+  display: flex;
			
 
				+  flex-direction: column;
			
 
				+  width: 100%;
			
 
				+    height: 100%;
			
 
				+    margin-top: 2.92rem;
			
 
				+}
			
 
				+.page-4 .text-1{
			
 
				+  margin-left: 1.54rem;
			
 
				+}
			
 
				+.page-4 .jin{
			
 
				+font-size: 0.48rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.56rem;
			
 
				+letter-spacing: 7px;
			
 
				+margin-bottom: 0.16rem;
			
 
				+}
			
 
				+.page-4 .day{
			
 
				+  display: flex;
			
 
				+}
			
 
				+.page-4 .ty{
			
 
				+font-size: 0.32rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+}
			
 
				+.page-4 .days{
			
 
				+font-size: 0.32rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #70EEFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+}
			
 
				+.page-4 .text-2{
			
 
				+  margin-top: 0.71rem
			
 
				+}
			
 
				+.page-4 .night{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  margin-left: 3.28rem;
			
 
				+  margin-bottom : 0.24rem;
			
 
				+}
			
 
				+.page-4 .big-day{
			
 
				+font-size: 0.48rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #70EEFF;
			
 
				+line-height: 0.56rem;
			
 
				+letter-spacing: 7px;
			
 
				+}
			
 
				+.page-4 .text-bottom{
			
 
				+  text-align: center;
			
 
				+  position: absolute;
			
 
				+    bottom: 1.92rem;
			
 
				+    right: 2.06rem;
			
 
				+}
			
 
				+.page-4 .text-3{
			
 
				+font-size: 0.28rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+}
			
 
				+.page-4 .btn-next{
			
 
				+  display: flex;
			
 
				+    align-items: center;
			
 
				+    justify-content: center;
			
 
				+}
			
 
				+.page-4 .fish-four{
			
 
				+  position: absolute;
			
 
				+  bottom: 0;
			
 
				+  left: 0;
			
 
				+  z-index: -1;
			
 
				+}
			
 
				+.page-4 .fish-four img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+.page-4 .sm-four{
			
 
				+  position: absolute;
			
 
				+  bottom: 7.16rem;
			
 
				+  right: 1.78rem;
			
 
				+  width: 1.36rem;
			
 
				+  height: 0.77rem;
			
 
				+}
			
 
				+.page-4 .sm-four img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+.page-4 .big-four{
			
 
				+  position: absolute;
			
 
				+  bottom: 3.78rem;
			
 
				+  left: 0.14rem;
			
 
				+  width: 3.5rem;
			
 
				+
			
 
				+}
			
 
				+.page-4 .big-four img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+/* E第四页 */
			
 
				+
			
 
				+/* S第五页 */
			
 
				+.page-5 .item{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  margin-top: 2.92rem;
			
 
				+}
			
 
				+.page-5 .this{
			
 
				+font-size: 0.48rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.56rem;
			
 
				+letter-spacing: 7px;
			
 
				+margin-left: 1.54rem;
			
 
				+}
			
 
				+.page-5 .gongsi{
			
 
				+font-size: 0.32rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #70EEFF;
			
 
				+line-height: 0.38rem;
			
 
				+letter-spacing: 4px;
			
 
				+margin: 0.32rem auto;
			
 
				+margin-left: 1.54rem;
			
 
				+}
			
 
				+.page-5 .guanzhu{
			
 
				+font-size: 0.32rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+margin-left: 1.54rem;
			
 
				+}
			
 
				+.page-5 .text-bottom{
			
 
				+  position: absolute;
			
 
				+  bottom: 1.92rem;
			
 
				+  right: 1.68rem;
			
 
				+  text-align: center;
			
 
				+}
			
 
				+.page-5  p{
			
 
				+font-size: 0.28rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+}
			
 
				+.page-5 .btn-next{
			
 
				+  display: flex;
			
 
				+    align-items: center;
			
 
				+    justify-content: center;
			
 
				+}
			
 
				+.page-5 .yun-five{
			
 
				+  position: absolute;
			
 
				+  bottom: 4.88rem;
			
 
				+  left: 0;
			
 
				+  z-index: -1;
			
 
				+}
			
 
				+.page-5 .yun-five img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+.page-5 .ball-five{
			
 
				+  position: absolute;
			
 
				+    bottom: 5.3rem;
			
 
				+    left: 0.7rem;
			
 
				+    z-index: -9;
			
 
				+}
			
 
				+.page-5 .ball-five img{
			
 
				+  width: 4.64rem;
			
 
				+}
			
 
				+.page-5 .fish-five{
			
 
				+  position: absolute;
			
 
				+  left: 1.5rem;
			
 
				+  bottom: 5.12rem;
			
 
				+  width: 4.22rem;
			
 
				+  z-index: -2;
			
 
				+}
			
 
				+.page-5 .fish-five img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+.page-5 .aoyi-five{
			
 
				+  position: absolute;
			
 
				+  right: 0;
			
 
				+  top: 4.3rem;
			
 
				+  width: 7.81rem;
			
 
				+  z-index: -10;
			
 
				+}
			
 
				+.page-5 .aoyi-five img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+/* E第五页 */
			
 
				+
			
 
				+/* S第六页 */
			
 
				+.page-6 .message{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  margin-top: 2.92rem;
			
 
				+}
			
 
				+.page-6 .year{
			
 
				+font-size: 0.48rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.56rem;
			
 
				+letter-spacing: 7px;
			
 
				+margin-left: 1.54rem;
			
 
				+}
			
 
				+.page-6 .you{
			
 
				+font-size: 0.32rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+margin-top: 0.32rem;
			
 
				+margin-left: 1.54rem;
			
 
				+}
			
 
				+.page-6 .num{
			
 
				+font-size: 0.48rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #70EEFF;
			
 
				+line-height: 0.56rem;
			
 
				+letter-spacing: 7px;
			
 
				+margin-left: 4.1rem;
			
 
				+}
			
 
				+.page-6 .xiangmu{
			
 
				+font-size: 0.32rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+margin-top: 0.16rem;
			
 
				+margin-left: 3.5rem;
			
 
				+}
			
 
				+.page-6 .text-one{
			
 
				+font-size: 0.28rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+/* margin-left: 2.8rem; */
			
 
				+text-align: center;
			
 
				+position: absolute;
			
 
				+bottom: 4.32rem;
			
 
				+left: 2.8rem;
			
 
				+}
			
 
				+.page-6 .text-two{
			
 
				+  width: 5.98rem;
			
 
				+  height: 1.4rem;
			
 
				+  background: #171826;
			
 
				+  border-radius: 0.16rem 0.16rem 0.16rem 0.16rem;
			
 
				+  opacity: 0.3;
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+  flex-direction: column;
			
 
				+  position: absolute;
			
 
				+    bottom: 2.6rem;
			
 
				+    left: 1.58rem;
			
 
				+    padding: 0.24rem 0.38rem;
			
 
				+
			
 
				+}
			
 
				+.page-6 .box{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+}
			
 
				+.page-6 .p-one{
			
 
				+font-size: 0.24rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.28rem;
			
 
				+letter-spacing: 1px;
			
 
				+}
			
 
				+.page-6 .s-one{
			
 
				+font-size: 0.28rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #70EEFF;
			
 
				+line-height: 0.33rem;
			
 
				+letter-spacing: 2px;
			
 
				+}
			
 
				+.page-6 .text-bottom{
			
 
				+font-size: 0.28rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+margin-top: 0.32rem;
			
 
				+position: absolute;
			
 
				+    bottom: 1.92rem;
			
 
				+    left: 2.98rem;
			
 
				+}
			
 
				+.page-6 .btn-next{
			
 
				+  display: flex;
			
 
				+    align-items: center;
			
 
				+    justify-content: center;
			
 
				+}
			
 
				+
			
 
				+.page-6 .ball-six{
			
 
				+  position: absolute;
			
 
				+  right: 0;
			
 
				+    top: 5.48rem;
			
 
				+    width: 2.74rem;
			
 
				+    z-index: -1;
			
 
				+}
			
 
				+.page-6 .ball-six img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+.page-6 .group-six{
			
 
				+  position: absolute;
			
 
				+  left: 0.9rem;
			
 
				+  bottom: 4.6rem;
			
 
				+  z-index: -1;
			
 
				+}
			
 
				+.page-6 .group-six img{
			
 
				+  width: 6.31rem;
			
 
				+}
			
 
				+.page-6 .fish-six{
			
 
				+  z-index: -16;
			
 
				+    position: absolute;
			
 
				+    top: 8.4rem;
			
 
				+    left: 1.6rem;
			
 
				+    width: 1.98rem;
			
 
				+}
			
 
				+.page-6 .fish-six img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+.page-6 .xd-six{
			
 
				+  position: absolute;
			
 
				+    top: 0.04rem;
			
 
				+    left: 0;
			
 
				+    z-index: -6;
			
 
				+}
			
 
				+.page-6 .xd-six img{
			
 
				+  width: 9.14rem;
			
 
				+}
			
 
				+/* E第六页 */
			
 
				+
			
 
				+
			
 
				+/* S第七页 */
			
 
				+.page-7 .sum{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  margin-top: 2.92rem;
			
 
				+}
			
 
				+.page-7 .year{
			
 
				+font-size: 0.48rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.56rem;
			
 
				+letter-spacing: 7px;
			
 
				+margin-left: 1.54rem;
			
 
				+}
			
 
				+.page-7 .you{
			
 
				+font-size: 0.32rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+margin-left: 1.54rem;
			
 
				+margin-top: 0.32rem;
			
 
				+}
			
 
				+.page-7 .num{
			
 
				+font-size: 0.48rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #70EEFF;
			
 
				+line-height: 0.56rem;
			
 
				+letter-spacing: 7px;
			
 
				+margin-left: 4.1rem;
			
 
				+}
			
 
				+.page-7 .text-bottom{
			
 
				+font-size: 0.28rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+position: absolute;
			
 
				+    bottom: 1.92rem;
			
 
				+    left: 2.42rem;
			
 
				+}
			
 
				+.page-7 .btn-next{
			
 
				+  display: flex;
			
 
				+    align-items: center;
			
 
				+    justify-content: center;
			
 
				+}
			
 
				+.page-7 .xd-seven{
			
 
				+  position: absolute;
			
 
				+  right: 0;
			
 
				+  bottom: 1.9rem;
			
 
				+  z-index: -1;
			
 
				+}
			
 
				+.page-7 .xd-seven img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+/* E第七页 */
			
 
				+
			
 
				+/* S第八页 */
			
 
				+.page-8 .friend{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  margin-top: 2.92rem;
			
 
				+}
			
 
				+.page-8 .year{
			
 
				+  font-size: 0.48rem;
			
 
				+  font-family: PingFang SC-Bold, PingFang SC;
			
 
				+  font-weight: bold;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.56rem;
			
 
				+  letter-spacing: 7px;
			
 
				+  margin-left: 1.54rem;
			
 
				+  }
			
 
				+.page-8 .num{
			
 
				+font-size: 0.48rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #70EEFF;
			
 
				+line-height: 0.56rem;
			
 
				+letter-spacing: 7px;
			
 
				+margin-left: 4.96rem;
			
 
				+margin-top: 0.32rem;
			
 
				+}
			
 
				+.page-8 .you{
			
 
				+font-size: 0.32rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+margin-left: 2.44rem;
			
 
				+margin-top: 0.16rem;
			
 
				+}
			
 
				+.page-8 .text-bottom{
			
 
				+  text-align: center;
			
 
				+  position: absolute;
			
 
				+  left: 1.88rem;
			
 
				+  bottom: 1.92rem;
			
 
				+}
			
 
				+.page-8 .text{
			
 
				+font-size: 0.28rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.52rem;
			
 
				+letter-spacing: 4px;
			
 
				+}
			
 
				+
			
 
				+.page-8 .btn-next{
			
 
				+  display: flex;
			
 
				+    align-items: center;
			
 
				+    justify-content: center;
			
 
				+}
			
 
				+.page-8 .ball-eight{
			
 
				+  position: absolute;
			
 
				+  right: 0;
			
 
				+  bottom: 3.02rem;
			
 
				+  width: 7.88rem;
			
 
				+  z-index: -1;
			
 
				+}
			
 
				+.page-8 .ball-eight img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+.page-8 .xd-eight{
			
 
				+  position: absolute;
			
 
				+  left: 0;
			
 
				+  bottom: 3.48rem;
			
 
				+  z-index: -9;
			
 
				+}
			
 
				+.page-8 .xd-eight img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+/* E第八页 */
			
 
				+
			
 
				+/* S第九页 */
			
 
				+.page-9 .mouth{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  margin-top: 2.92rem;
			
 
				+}
			
 
				+.page-9 .year{
			
 
				+  display: flex;
			
 
				+font-size: 0.48rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.56rem;
			
 
				+letter-spacing: 7px;
			
 
				+margin-left: 1.54rem;
			
 
				+}
			
 
				+.page-9 .you{
			
 
				+font-size: 0.32rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+margin-left: 1.54rem;
			
 
				+margin-top: 0.32rem;
			
 
				+}
			
 
				+.page-9 .text-bottom{
			
 
				+  text-align: center;
			
 
				+  position: absolute;
			
 
				+  left: 2.42rem;
			
 
				+  bottom: 1.92rem;
			
 
				+}
			
 
				+.page-9 .text{
			
 
				+  font-size: 0.28rem;
			
 
				+  font-family: PingFang SC-Regular, PingFang SC;
			
 
				+  font-weight: 400;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.52rem;
			
 
				+  letter-spacing: 4px;
			
 
				+  }
			
 
				+.page-9 .btn-next{
			
 
				+  display: flex;
			
 
				+    align-items: center;
			
 
				+    justify-content: center;
			
 
				+}
			
 
				+.page-9 .banner-yue{
			
 
				+  position: absolute;
			
 
				+  bottom: 5.78rem;
			
 
				+  left: 3.76rem;
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+}
			
 
				+.page-9 .banner-yue-one{
			
 
				+  font-size: 2.02rem;
			
 
				+  font-family: PingFang SC-Bold, PingFang SC;
			
 
				+  font-weight: bold;
			
 
				+  color: #171826;
			
 
				+  line-height: 2.37rem;
			
 
				+  letter-spacing: 30px;
			
 
				+}
			
 
				+.page-9 .banner-yue-two{
			
 
				+  font-size: 0.48rem;
			
 
				+  font-family: PingFang SC-Bold, PingFang SC;
			
 
				+  font-weight: bold;
			
 
				+  color: #171826;
			
 
				+  line-height: 0.56rem;
			
 
				+  letter-spacing: 7px;
			
 
				+  position: absolute;
			
 
				+    bottom: 0.3rem;
			
 
				+    left: 1.4rem;
			
 
				+}
			
 
				+.page-9 .ball-nine{
			
 
				+  position: absolute;
			
 
				+  bottom: 0;
			
 
				+  left: 0;
			
 
				+  z-index: -1;
			
 
				+}
			
 
				+.page-9 .ball-nine img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+/* E第九页 */
			
 
				+
			
 
				+/* S第十页 */
			
 
				+.page-10 .ten{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  margin-top: 2.92rem;
			
 
				+}
			
 
				+.page-10 .year{
			
 
				+font-size: 0.48rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.56rem;
			
 
				+letter-spacing: 7px;
			
 
				+margin-left: 1.54rem;
			
 
				+}
			
 
				+.page-10 .you{
			
 
				+font-size: 0.32rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+margin-left: 1.54rem;
			
 
				+margin-top: 0.32rem;
			
 
				+}
			
 
				+.page-10 .num{
			
 
				+font-size: 0.48rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #70EEFF;
			
 
				+line-height: 0.56rem;
			
 
				+letter-spacing: 7px;
			
 
				+margin-left: 4.52rem;
			
 
				+}
			
 
				+.page-10 .gonggao{
			
 
				+  font-size: 0.32rem;
			
 
				+  font-family: PingFang SC-Regular, PingFang SC;
			
 
				+  font-weight: 400;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.36rem;
			
 
				+  letter-spacing: 4px;
			
 
				+  margin-left: 3.5rem;
			
 
				+  margin-top: 0.16rem;
			
 
				+}
			
 
				+.page-10 .text-bottom{
			
 
				+  text-align: center;
			
 
				+  position: absolute;
			
 
				+  bottom: 1.92rem;
			
 
				+  left: 2.98rem;
			
 
				+}
			
 
				+.page-10 .text{
			
 
				+font-size: 0.28rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+}
			
 
				+.page-10 .btn-next{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+}
			
 
				+.page-10 .pao-ten{
			
 
				+  position: absolute;
			
 
				+  bottom: 1.7rem;
			
 
				+  left: 0;
			
 
				+  z-index: -9;
			
 
				+}
			
 
				+.page-10 .pao-ten img{
			
 
				+  width:9.14rem;
			
 
				+}
			
 
				+.page-10 .fish-ten{
			
 
				+  position: absolute;
			
 
				+  bottom: 0;
			
 
				+  left: 0;
			
 
				+  z-index: -7;
			
 
				+}
			
 
				+.page-10 .fish-ten img{
			
 
				+ width: 100%;
			
 
				+}
			
 
				+.page-10 .big-ten{
			
 
				+  position: absolute;
			
 
				+  bottom: 4.44rem;
			
 
				+  left: 1.52rem;
			
 
				+  width: 2.8rem;
			
 
				+  z-index: -5;
			
 
				+}
			
 
				+.page-10 .big-ten img{
			
 
				+ width: 100%;
			
 
				+}
			
 
				+.page-10 .sm-ten{
			
 
				+  position: absolute;
			
 
				+  top: 6.34rem;
			
 
				+  right: 2.94rem;
			
 
				+  width: 1.36rem;
			
 
				+  height: 0.77rem;
			
 
				+  z-index: -5;
			
 
				+}
			
 
				+.page-10 .sm-ten img{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+/* E第十页 */
			
 
				+
			
 
				+
			
 
				+/* S第十一页 */
			
 
				+.page-11 .eleven{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  margin-top: 2.92rem;
			
 
				+}
			
 
				+.page-11 .year{
			
 
				+  font-size: 0.48rem;
			
 
				+  font-family: PingFang SC-Bold, PingFang SC;
			
 
				+  font-weight: bold;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.56rem;
			
 
				+  letter-spacing: 7px;
			
 
				+  margin-left: 1.54rem;
			
 
				+}
			
 
				+.page-11 .new{
			
 
				+  font-size: 0.32rem;
			
 
				+  font-family: PingFang SC-Regular, PingFang SC;
			
 
				+  font-weight: 400;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.36rem;
			
 
				+  letter-spacing: 4px;
			
 
				+}
			
 
				+.page-11 .you{
			
 
				+  font-size: 0.32rem;
			
 
				+  font-family: PingFang SC-Regular, PingFang SC;
			
 
				+  font-weight: 400;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.36rem;
			
 
				+  letter-spacing: 4px;
			
 
				+  margin-left: 1.54rem;
			
 
				+  margin-top: 0.32rem;
			
 
				+}
			
 
				+.page-11 .gn{
			
 
				+  margin-left: 1.54rem;
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  margin-top: 0.48rem;
			
 
				+}
			
 
				+.page-11 .num{
			
 
				+font-size: 0.48rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #70EEFF;
			
 
				+line-height: 0.56rem;
			
 
				+letter-spacing: 7px;
			
 
				+}
			
 
				+.page-11 .list{
			
 
				+  display: flex;
			
 
				+  flex-direction: column;
			
 
				+  justify-content: center;
			
 
				+  margin-left: 1.48rem;
			
 
				+  margin-top: 3.1rem;
			
 
				+}
			
 
				+.page-11 .list p{
			
 
				+  font-size: 0.28rem;
			
 
				+  font-family: PingFang SC-Regular, PingFang SC;
			
 
				+  font-weight: 400;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.52rem;
			
 
				+  letter-spacing: 4px;
			
 
				+  margin: 0;
			
 
				+}
			
 
				+.page-11 .text-bottom{
			
 
				+  text-align: center;
			
 
				+  position: absolute;
			
 
				+  bottom: 1.92rem;
			
 
				+  left: 2.8rem;
			
 
				+}
			
 
				+.page-11 .text{
			
 
				+font-size: 0.28rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.52rem;
			
 
				+letter-spacing: 4px;
			
 
				+}
			
 
				+.page-11 .btn-next{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+}
			
 
				+.page-11 .ball-eleven{
			
 
				+  position: absolute;
			
 
				+  bottom: 0;
			
 
				+  left: 0.24rem;
			
 
				+  z-index: -1;
			
 
				+}
			
 
				+.page-11 .ball-eleven img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+.page-11 .fish-eleven{
			
 
				+  position: absolute;
			
 
				+  bottom: 2.7rem;
			
 
				+  left: 1.84rem;
			
 
				+}
			
 
				+.page-11 .fish-eleven img{
			
 
				+  width: 2.91rem;
			
 
				+}
			
 
				+
			
 
				+/* E第十一页 */
			
 
				+
			
 
				+
			
 
				+/* S第十二页 */
			
 
				+.page-12 .twelve{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  margin-top: 5.44rem;
			
 
				+}
			
 
				+.page-12 .text{
			
 
				+  display: flex;
			
 
				+  flex-direction: column;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+}
			
 
				+.page-12 .text-1{
			
 
				+font-size: 0.28rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+}
			
 
				+.page-12 .text-3{
			
 
				+font-size: 0.48rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.56rem;
			
 
				+letter-spacing: 7px;
			
 
				+margin-top: 0.43rem;
			
 
				+}
			
 
				+.page-12 .btn{
			
 
				+  text-align: center;
			
 
				+  width: 4.56rem;
			
 
				+  height: 0.96rem;
			
 
				+  background: linear-gradient(180deg, #FFFFFF 0%, #57FFF5 100%);
			
 
				+  box-shadow: 0rem 0.08rem 0.32rem 0.02rem rgba(8, 31, 38, 0.08);
			
 
				+  opacity: 1;
			
 
				+  border-radius: 0.48rem;
			
 
				+  margin-top: 0.2rem;
			
 
				+}
			
 
				+.page-12 .sc{
			
 
				+  background: linear-gradient(180deg, #57FFF5 0%, #FFFFFF 100%);
			
 
				+  box-shadow: 0px 0.08rem 0.32rem 1px rgba(8, 31, 38, 0.08);
			
 
				+  font-size: 0.4rem;
			
 
				+  line-height: 0.96rem;
			
 
				+  font-weight: bold;
			
 
				+  color: #10616B;
			
 
				+  letter-spacing: 0.06rem;
			
 
				+  border-radius: 0.48rem;
			
 
				+}
			
 
				+.page-12 .sm-star-twelve{
			
 
				+    position: absolute;
			
 
				+    top: 4.06rem;
			
 
				+    right: 1.78rem;
			
 
				+    width: 1.36rem;
			
 
				+    height: 0.77rem;
			
 
				+}
			
 
				+.page-12 .sm-star-twelve img{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+.page-12 .xd-twelve{
			
 
				+  position: absolute;
			
 
				+  bottom: 0rem;
			
 
				+  left: 0rem;
			
 
				+}
			
 
				+.page-12 .xd-twelve img{
			
 
				+  width: 100%;
			
 
				+
			
 
				+}
			
 
				+.page-12 .big-star-twelve{
			
 
				+  position: absolute;
			
 
				+  bottom: 3.78rem;
			
 
				+  left: 0.34rem;
			
 
				+  width: 3.5rem;
			
 
				+}
			
 
				+.page-12 .big-star-twelve img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+.page-12 .btn-next{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+}
			
 
				+
			
 
				+
			
 
				+/* E第十二页 */
			
 
				+
			
 
				+/* 新用户 */
			
 
				+/* S新用户0 */
			
 
				+.page-new-0 .new-zero{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  margin-top: 2.94rem;
			
 
				+}
			
 
				+.page-new-0 .text{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  flex-direction: column;
			
 
				+  justify-content: center;
			
 
				+}
			
 
				+.page-new-0 .year{
			
 
				+  height: 0.68rem;
			
 
				+  font-size: 0.48rem;
			
 
				+  font-family: PingFang SC-Bold, PingFang SC;
			
 
				+  font-weight: bold;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.56rem;
			
 
				+  letter-spacing: 7px;
			
 
				+}
			
 
				+.page-new-0 .text-1{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  flex-direction: column;
			
 
				+  justify-content: center;
			
 
				+  margin-top: 0.32rem;
			
 
				+}
			
 
				+.page-new-0 .text-1 p{
			
 
				+font-size: 0.28rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.52rem;
			
 
				+letter-spacing: 4px;
			
 
				+margin: 0;
			
 
				+}
			
 
				+.page-new-0 .text-2{
			
 
				+  height: 1.4rem;
			
 
				+  background: #171826;
			
 
				+  border-radius: 0.16rem 0.16rem 0.16rem 0.16rem;
			
 
				+  opacity: 0.3;
			
 
				+  padding: 0.24rem;
			
 
				+  text-align: center;
			
 
				+  margin-top: 0.4rem;
			
 
				+  padding: 0.24rem;
			
 
				+}
			
 
				+.page-new-0 .text-2 div{
			
 
				+  font-size: 0.24rem;
			
 
				+  font-family: PingFang SC-Regular, PingFang SC;
			
 
				+  font-weight: 400;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.62rem;
			
 
				+  letter-spacing: 1px;
			
 
				+}
			
 
				+.page-new-0 .text-3{
			
 
				+  text-align: center;
			
 
				+  margin-top: 0.32rem;
			
 
				+}
			
 
				+.page-new-0 .text-3 div{
			
 
				+  font-size: 0.28rem;
			
 
				+  font-family: PingFang SC-Regular, PingFang SC;
			
 
				+  font-weight: 400;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.52rem;
			
 
				+  letter-spacing: 4px;
			
 
				+}
			
 
				+.page-new-0 .btn{
			
 
				+  width: 4.56rem;
			
 
				+  height: 0.96rem;
			
 
				+  background: linear-gradient(180deg, #57FFF5 0%, #FFFFFF 100%);
			
 
				+  opacity: 1;
			
 
				+  font-size: 0.4rem;
			
 
				+  font-family: PingFang SC-Bold, PingFang SC;
			
 
				+  font-weight: bold;
			
 
				+  color: #10616B;
			
 
				+  line-height: 0.96rem;
			
 
				+  letter-spacing: 3px;
			
 
				+  text-align: center;
			
 
				+  border-radius: 0.48rem;
			
 
				+  margin-top: 0.32rem;
			
 
				+}
			
 
				+.page-new-0 .btn-next{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+}
			
 
				+.page-new-0  .sm-zero{
			
 
				+  position: absolute;
			
 
				+  top: 4.06rem;
			
 
				+  right: 1.78rem;
			
 
				+  width: 1.36rem;
			
 
				+}
			
 
				+.page-new-0  .sm-zero img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+.page-new-0  .fish-zero{
			
 
				+  position: absolute;
			
 
				+  top: 4.4rem;
			
 
				+  width: 9.14rem;
			
 
				+
			
 
				+  z-index: -1;
			
 
				+  
			
 
				+}
			
 
				+.page-new-0  .fish-zero img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+.page-new-0  .xd-zero{
			
 
				+  position: absolute;
			
 
				+  top: 4rem;
			
 
				+  left: 0;
			
 
				+  z-index: -9;
			
 
				+
			
 
				+}
			
 
				+.page-new-0  .xd-zero img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+.page-new-0 .big-zero{
			
 
				+  position: absolute;
			
 
				+    bottom: 1.52rem;
			
 
				+    left: 0.34rem;
			
 
				+    width: 3.78rem;
			
 
				+    z-index: -8;
			
 
				+}
			
 
				+.page-new-0 .big-zero img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+/* E新用户0 */
			
 
				+
			
 
				+/* S5678空 */
			
 
				+.page-5678-kong .sum{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  margin-top: 2.92rem;
			
 
				+  text-align: center;
			
 
				+}
			
 
				+.page-5678-kong .year{
			
 
				+  font-size: 0.32rem;
			
 
				+  font-family: PingFang SC-Regular, PingFang SC;
			
 
				+  font-weight: 400;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.36rem;
			
 
				+  letter-spacing: 4px;
			
 
				+}
			
 
				+.page-5678-kong .you{
			
 
				+  font-size: 0.48rem;
			
 
				+  font-family: PingFang SC-Bold, PingFang SC;
			
 
				+  font-weight: bold;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.56rem;
			
 
				+  letter-spacing: 7px;
			
 
				+  margin-top: 0.32rem;
			
 
				+}
			
 
				+.page-5678-kong .num{
			
 
				+  font-size: 0.28rem;
			
 
				+  font-family: PingFang SC-Regular, PingFang SC;
			
 
				+  font-weight: 400;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.36rem;
			
 
				+  letter-spacing: 4px;
			
 
				+  margin-top: 0.32rem;
			
 
				+}
			
 
				+.page-5678-kong .text{
			
 
				+  font-size: 0.32rem;
			
 
				+  font-family: PingFang SC-Bold, PingFang SC;
			
 
				+  font-weight: bold;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.36rem;
			
 
				+  letter-spacing: 4px;
			
 
				+  margin-top: 0.32rem;
			
 
				+}
			
 
				+.page-5678-kong .text-bottom{
			
 
				+  font-size: 0.28rem;
			
 
				+  font-family: PingFang SC-Regular, PingFang SC;
			
 
				+  font-weight: 400;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.36rem;
			
 
				+  letter-spacing: 4px;
			
 
				+  position: absolute;
			
 
				+    bottom: 3.56rem;
			
 
				+    right: 2.3rem;
			
 
				+}
			
 
				+.page-5678-kong .btn{
			
 
				+  width: 4.56rem;
			
 
				+  height: 0.96rem;
			
 
				+  background: linear-gradient(180deg, #57FFF5 0%, #FFFFFF 100%);
			
 
				+  opacity: 1;
			
 
				+  font-size: 0.4rem;
			
 
				+  font-family: PingFang SC-Bold, PingFang SC;
			
 
				+  font-weight: bold;
			
 
				+  color: #10616B;
			
 
				+  line-height: 0.96rem;
			
 
				+  letter-spacing: 3px;
			
 
				+  text-align: center;
			
 
				+  border-radius: 0.48rem;
			
 
				+  margin-top: 0.26rem;
			
 
				+  position: absolute;
			
 
				+    bottom: 2.23rem;
			
 
				+    left: 2.3rem;
			
 
				+}
			
 
				+.page-5678-kong .btn-next{
			
 
				+  display: flex;
			
 
				+    align-items: center;
			
 
				+    justify-content: center;
			
 
				+}
			
 
				+.page-5678-kong .xd-seven{
			
 
				+  position: absolute;
			
 
				+  right: 0;
			
 
				+  bottom: 1.9rem;
			
 
				+  z-index: -1;
			
 
				+}
			
 
				+.page-5678-kong .xd-seven img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+/* E5678空 */
			
 
				+
			
 
				+/* S第十页 空 */
			
 
				+.page-10-kong .ten{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  margin-top: 2.92rem;
			
 
				+}
			
 
				+.page-10-kong .year{
			
 
				+font-size: 0.48rem;
			
 
				+font-family: PingFang SC-Bold, PingFang SC;
			
 
				+font-weight: bold;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.56rem;
			
 
				+letter-spacing: 7px;
			
 
				+margin-left: 1.54rem;
			
 
				+}
			
 
				+.page-10-kong .you{
			
 
				+font-size: 0.32rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+margin-left: 1.54rem;
			
 
				+margin-top: 0.32rem;
			
 
				+}
			
 
				+.page-10-kong .text-zg{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+  flex-direction: column;
			
 
				+  width: 5.98rem;
			
 
				+  height: 1.4rem;
			
 
				+  background: #171826;
			
 
				+  border-radius: 0.16rem 0.16rem 0.16rem 0.16rem;
			
 
				+  opacity: 0.3;  
			
 
				+  margin-left: 1.58rem;
			
 
				+  margin-top: 0.72rem;  
			
 
				+}
			
 
				+.page-10-kong .text-zg div{
			
 
				+  font-size: 0.24rem;
			
 
				+  font-family: PingFang SC-Regular, PingFang SC;
			
 
				+  font-weight: 400;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.28rem;
			
 
				+  letter-spacing: 1px;
			
 
				+}
			
 
				+.page-10-kong .text-bottom{
			
 
				+  text-align: center;
			
 
				+  position: absolute;
			
 
				+  bottom: 1.92rem;
			
 
				+  left: 2.98rem;
			
 
				+}
			
 
				+.page-10-kong .text{
			
 
				+font-size: 0.28rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.36rem;
			
 
				+letter-spacing: 4px;
			
 
				+}
			
 
				+.page-10-kong .btn-next{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+}
			
 
				+.page-10-kong .pao-ten{
			
 
				+  position: absolute;
			
 
				+  bottom: 1.7rem;
			
 
				+  left: 0;
			
 
				+  z-index: -9;
			
 
				+}
			
 
				+.page-10-kong .pao-ten img{
			
 
				+  width:9.14rem;
			
 
				+}
			
 
				+.page-10-kong .fish-ten{
			
 
				+  position: absolute;
			
 
				+  bottom: 0;
			
 
				+  left: 0;
			
 
				+  z-index: -7;
			
 
				+}
			
 
				+.page-10-kong .fish-ten img{
			
 
				+ width: 100%;
			
 
				+}
			
 
				+.page-10-kong .big-ten{
			
 
				+  position: absolute;
			
 
				+  bottom: 4.44rem;
			
 
				+  left: 1.52rem;
			
 
				+  width: 2.8rem;
			
 
				+  z-index: -5;
			
 
				+}
			
 
				+.page-10-kong .big-ten img{
			
 
				+ width: 100%;
			
 
				+}
			
 
				+.page-10-kong .sm-ten{
			
 
				+  position: absolute;
			
 
				+  top: 6.34rem;
			
 
				+  right: 2.94rem;
			
 
				+  width: 1.36rem;
			
 
				+  height: 0.77rem;
			
 
				+  z-index: -5;
			
 
				+}
			
 
				+.page-10-kong .sm-ten img{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+/* E第十页 空*
			
 
				+
			
 
				+/* S第十一页 空*/
			
 
				+.page-11-kong .eleven{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  margin-top: 2.92rem;
			
 
				+}
			
 
				+.page-11-kong .year{
			
 
				+  font-size: 0.48rem;
			
 
				+  font-family: PingFang SC-Bold, PingFang SC;
			
 
				+  font-weight: bold;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.56rem;
			
 
				+  letter-spacing: 7px;
			
 
				+  margin-left: 1.54rem;
			
 
				+}
			
 
				+.page-11-kong .you{
			
 
				+  font-size: 0.32rem;
			
 
				+  font-family: PingFang SC-Regular, PingFang SC;
			
 
				+  font-weight: 400;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.36rem;
			
 
				+  letter-spacing: 4px;
			
 
				+  margin-left: 1.54rem;
			
 
				+  margin-top: 0.32rem;
			
 
				+}
			
 
				+.page-11-kong .list{
			
 
				+  display: flex;
			
 
				+  flex-direction: column;
			
 
				+  justify-content: center;
			
 
				+  margin-left: 1.48rem;
			
 
				+  margin-top: 3.1rem;
			
 
				+}
			
 
				+.page-11-kong .list p{
			
 
				+  font-size: 0.28rem;
			
 
				+  font-family: PingFang SC-Regular, PingFang SC;
			
 
				+  font-weight: 400;
			
 
				+  color: #FFFFFF;
			
 
				+  line-height: 0.52rem;
			
 
				+  letter-spacing: 4px;
			
 
				+  margin: 0;
			
 
				+}
			
 
				+.page-11-kong .text{
			
 
				+font-size: 0.28rem;
			
 
				+font-family: PingFang SC-Regular, PingFang SC;
			
 
				+font-weight: 400;
			
 
				+color: #FFFFFF;
			
 
				+line-height: 0.52rem;
			
 
				+letter-spacing: 4px;
			
 
				+margin-top: 2.56rem;
			
 
				+    margin-left: 2.8rem;
			
 
				+}
			
 
				+.page-11-kong .btn{
			
 
				+  width: 4.56rem;
			
 
				+  height: 0.96rem;
			
 
				+  background: linear-gradient(180deg, #57FFF5 0%, #FFFFFF 100%);
			
 
				+  opacity: 1; 
			
 
				+  font-size: 0.4rem;
			
 
				+  font-family: PingFang SC-Bold, PingFang SC;
			
 
				+  font-weight: bold;
			
 
				+  color: #10616B;
			
 
				+  line-height: 0.96rem;
			
 
				+  letter-spacing: 3px;
			
 
				+  text-align: center;
			
 
				+  border-radius: 0.48rem;
			
 
				+  margin-top: 0.26rem;
			
 
				+  position: absolute;
			
 
				+    bottom: 2.23rem;
			
 
				+    left: 2.3rem;
			
 
				+}
			
 
				+.page-11-kong .btn-next{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+}
			
 
				+.page-11-kong .ball-eleven{
			
 
				+  position: absolute;
			
 
				+  bottom: 0;
			
 
				+  left: 0.24rem;
			
 
				+}
			
 
				+.page-11-kong .ball-eleven img{
			
 
				+  width: 100%;
			
 
				+}
			
 
				+.page-11-kong .fish-eleven{
			
 
				+  position: absolute;
			
 
				+    bottom: 3.9rem;
			
 
				+    left: 1.2rem;
			
 
				+}
			
 
				+.page-11-kong .fish-eleven img{
			
 
				+  width: 2.91rem;
			
 
				+}
			
 
				+
			
 
				+/* E第十一页 */
			
--- a/src/web/staticres/common-module/yearEndReport/css/music.css
+++ b/src/web/staticres/common-module/yearEndReport/css/music.css
@@ -0,0 +1,56 @@
 
				+@keyframes rotate-music {
			
 
				+  0% {
			
 
				+    transform: rotate(0deg);
			
 
				+  }
			
 
				+  100% {
			
 
				+    transform: rotate(1turn);
			
 
				+  }
			
 
				+}
			
 
				+#music-control-box {
			
 
				+  position: fixed;
			
 
				+  overflow: hidden;
			
 
				+  z-index: 999;
			
 
				+  right: 1.14rem;
			
 
				+  top: 2.18rem;
			
 
				+  cursor: pointer;
			
 
				+}
			
 
				+#music-control-box.run-music .music-icon-box {
			
 
				+  -webkit-animation-play-state: running;
			
 
				+  animation-play-state: running;
			
 
				+}
			
 
				+#music-control-box .music-icon-box .icon-music-on {
			
 
				+  opacity: 0;
			
 
				+}
			
 
				+#music-control-box .music-icon-box .icon-music-off {
			
 
				+  opacity: 1;
			
 
				+}
			
 
				+#music-control-box.run-music .music-icon-box .icon-music-on {
			
 
				+  opacity: 1;
			
 
				+}
			
 
				+#music-control-box.run-music .music-icon-box .icon-music-off {
			
 
				+  opacity: 0;
			
 
				+}
			
 
				+#music-control-box .music-icon-box {
			
 
				+  position: relative;
			
 
				+  width: 0.64rem;
			
 
				+  height: 0.64rem;
			
 
				+  box-sizing: border-box;
			
 
				+  overflow: hidden;
			
 
				+  -webkit-animation: rotate-music 3s linear infinite;
			
 
				+  animation: rotate-music 3s linear infinite;
			
 
				+  -webkit-animation-play-state: paused;
			
 
				+  animation-play-state: paused;
			
 
				+}
			
 
				+
			
 
				+#music-control-box .music-icon-box img {
			
 
				+  position: absolute;
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  transition: opacity 0.25s;
			
 
				+}
			
 
				+#audio {
			
 
				+  position: absolute;
			
 
				+  top: -100%;
			
 
				+  left: -100%;
			
 
				+  z-index: -1;
			
 
				+}
			
--- a/src/web/staticres/common-module/yearEndReport/css/result.css
+++ b/src/web/staticres/common-module/yearEndReport/css/result.css
@@ -0,0 +1,286 @@
 
				+html,body{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  overflow: hidden;
			
 
				+  background-color: #000;
			
 
				+}
			
 
				+.mask-report{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+.result{
			
 
				+  position: relative;
			
 
				+  display: flex;
			
 
				+  flex-direction: column;
			
 
				+  align-items: center;
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  padding: 1.28rem 0;
			
 
				+  background: url(../images/result/bg.png) no-repeat center center;
			
 
				+  background-size: 100% 100%;
			
 
				+  overflow: hidden;
			
 
				+  box-sizing: border-box;
			
 
				+}
			
 
				+.r-content{
			
 
				+  position: relative;
			
 
				+  flex: 1;
			
 
				+  /* padding: 0 1.54rem; */
			
 
				+  width: 100%;
			
 
				+  box-sizing: border-box;
			
 
				+}
			
 
				+.info{
			
 
				+  width: 6.08rem;
			
 
				+  margin: 0 auto;
			
 
				+}
			
 
				+.r-content .user{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  margin-top: 0.8rem;
			
 
				+}
			
 
				+.r-content .head-img{
			
 
				+  width: 1.44rem;
			
 
				+  height: 1.44rem;
			
 
				+  border-radius: 50%;
			
 
				+  margin-right: .32rem;
			
 
				+  background-color: #ccc;
			
 
				+  overflow: hidden;
			
 
				+}
			
 
				+.r-content .head-img > img{
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+.r-content .nick-name{
			
 
				+  font-size: .32rem;
			
 
				+  color: #1DB5E5;
			
 
				+  line-height: .44rem;
			
 
				+}
			
 
				+
			
 
				+.r-content .role{
			
 
				+  /* position: relative; */
			
 
				+}
			
 
				+.r-content .role-placeholder{
			
 
				+  margin-top: .6rem;
			
 
				+  font-size: .28rem;
			
 
				+  color: #fff;
			
 
				+  line-height: .4rem;
			
 
				+}
			
 
				+.r-content .role-title{
			
 
				+  margin-top: .24rem;
			
 
				+  font-weight: bold;
			
 
				+  color: #FF9F40;
			
 
				+  font-size: .48rem;
			
 
				+}
			
 
				+.r-content .role-main{
			
 
				+  display: flex;
			
 
				+  flex-direction: column;
			
 
				+  /* align-items: center; */
			
 
				+  padding: .36rem .4rem;
			
 
				+  margin-top: .52rem;
			
 
				+  background: rgba(36, 181, 204, 0.2);
			
 
				+  border: 1px solid rgba(42, 190, 209, 0.6);
			
 
				+  box-sizing: border-box;
			
 
				+  border-radius: 8px;
			
 
				+}
			
 
				+.r-content .role-text{
			
 
				+  margin-bottom: .24rem;
			
 
				+  font-size: .32rem;
			
 
				+  color: #fff;
			
 
				+  line-height: .48rem;
			
 
				+}
			
 
				+.r-content .role-label{
			
 
				+  width: 100%;
			
 
				+  height: .72rem;
			
 
				+  /* background-position: left center;
			
 
				+  background-repeat: no-repeat;
			
 
				+  background-size: contain; */
			
 
				+}
			
 
				+.r-content .role-label > img{
			
 
				+  display: block;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+.r-content .role-bg{
			
 
				+  position: absolute;
			
 
				+  left: 0;
			
 
				+  /* background-position: center center;
			
 
				+  background-repeat: no-repeat;
			
 
				+  background-size: 100% 100%; */
			
 
				+  
			
 
				+}
			
 
				+.r-content .role-bg > img{
			
 
				+  display: block;
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+/* .r-content .role-bg-1{
			
 
				+  top: 1.68rem;
			
 
				+  width: 8.54rem;
			
 
				+  height: 10.46rem;
			
 
				+}
			
 
				+.r-content .role-bg-2{
			
 
				+  top: -1.28rem;
			
 
				+  width: 8.18rem;
			
 
				+  height: 13.5rem;
			
 
				+} */
			
 
				+.r-content .role-bg-other{
			
 
				+  bottom: 0;
			
 
				+  width: 7.84rem;
			
 
				+  height: auto;
			
 
				+}
			
 
				+.r-content .role-bg-other .ball{
			
 
				+  display: block;
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+.role-bg-other .super-man{
			
 
				+  position: absolute;
			
 
				+  top: 1.54rem;
			
 
				+  left: 3.18rem;
			
 
				+  width: 2.34rem;
			
 
				+  height: 2.31rem;
			
 
				+}
			
 
				+.r-content .role-bg-other .super-man > img {
			
 
				+  display: block;
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+
			
 
				+/* 偏移的样式 */
			
 
				+.mask-report-active{
			
 
				+  position: relative;
			
 
				+  top: 50%;
			
 
				+  left: 50%;
			
 
				+  width : 375px;
			
 
				+  height: 728px;
			
 
				+  overflow: hidden;
			
 
				+  transform: translate(-50%, -50%);
			
 
				+  background-color: #000;
			
 
				+}
			
 
				+
			
 
				+/* 装饰 */
			
 
				+.voice {
			
 
				+  position: absolute;
			
 
				+  top: 2.08rem;
			
 
				+  right: 1.14rem;
			
 
				+  width: .64rem;
			
 
				+  height: .64rem;
			
 
				+}
			
 
				+
			
 
				+.ball{
			
 
				+  position: absolute;
			
 
				+  top: 2.88rem;
			
 
				+  right: .68rem;
			
 
				+  width: 1.12rem;
			
 
				+  height: .88rem;
			
 
				+}
			
 
				+.star{
			
 
				+  position: absolute;
			
 
				+  top: 0;
			
 
				+  right: 1.48rem;
			
 
				+  width: .78rem;
			
 
				+  height: 3.82rem;
			
 
				+}
			
 
				+.voice > img,
			
 
				+.ball > img,
			
 
				+.star >img{
			
 
				+  display: block;
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+
			
 
				+/* 按钮 */
			
 
				+.r-btns{
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+  margin-top: 0.44rem;
			
 
				+}
			
 
				+.r-btns button{
			
 
				+  width: 2.96rem;
			
 
				+  height: .92rem;
			
 
				+  border: 0;
			
 
				+  outline: 0;
			
 
				+  background-repeat: no-repeat;
			
 
				+  background-position: center center;
			
 
				+  background-color: transparent;
			
 
				+  font-size: .36rem;
			
 
				+  font-weight: bold;
			
 
				+}
			
 
				+.r-btns .share-btn{
			
 
				+  height: .9rem;
			
 
				+  background-image: url(../images/result/share-btn.png);
			
 
				+  background-size: contain;
			
 
				+  margin-right: .56rem;
			
 
				+  color: #10616B;
			
 
				+}
			
 
				+.r-btns .create-btn{
			
 
				+  background-image: url(../images/result/create-btn.png);
			
 
				+  background-size: contain;
			
 
				+  color: #fff;
			
 
				+}
			
 
				+/* logo、qcode */
			
 
				+.r-bottom{
			
 
				+  width: 100%;
			
 
				+  display: flex;
			
 
				+  justify-content: space-between;
			
 
				+  align-items: flex-end;
			
 
				+  padding: 0 .6rem;
			
 
				+  box-sizing: border-box;
			
 
				+}
			
 
				+.r-bottom .jy-logo{
			
 
				+  width: 1.84rem;
			
 
				+  height: .48rem;
			
 
				+}
			
 
				+.r-bottom .jy-logo > img{
			
 
				+  display: block;
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+
			
 
				+.r-bottom .jy-qcode{
			
 
				+  display: flex;
			
 
				+  align-items: flex-end;
			
 
				+  font-size: .32rem;
			
 
				+  color: #fff;
			
 
				+  line-height: .49rem;
			
 
				+}
			
 
				+.r-bottom .code-label{
			
 
				+  margin-right: .16rem;
			
 
				+  font-size: .26rem;
			
 
				+}
			
 
				+.r-bottom .code-img{
			
 
				+  width: 1.75rem;
			
 
				+  height: 1.75rem;
			
 
				+}
			
 
				+.r-bottom .code-img > img{
			
 
				+  display: block;
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+}
			
 
				+/* 生成的canvas图片 */
			
 
				+.canvas{
			
 
				+  position: fixed;
			
 
				+  top: 0;
			
 
				+  left: 0;
			
 
				+  right: 0;
			
 
				+  bottom: 0;
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  z-index: 99;
			
 
				+  background-color: #000;
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  justify-content: center;
			
 
				+  font-size: 0;
			
 
				+}
			
 
				+.canvas-img{
			
 
				+  display: block;
			
 
				+  width: 100%; 
			
 
				+  height: 100%;
			
 
				+  object-fit: scale-down;
			
 
				+}
			
 
				+/* 重置vant */
			
 
				+.van-action-sheet__cancel, .van-action-sheet__item{
			
 
				+  font-size: 18px;
			
 
				+  line-height: 28px;
			
 
				+}
			
--- a/src/web/staticres/common-module/yearEndReport/images/BG/bg.png
+++ b/src/web/staticres/common-module/yearEndReport/images/BG/bg.png
--- a/src/web/staticres/common-module/yearEndReport/images/P0/big-zero.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P0/big-zero.png
--- a/src/web/staticres/common-module/yearEndReport/images/P0/fish-zero.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P0/fish-zero.png
--- a/src/web/staticres/common-module/yearEndReport/images/P0/sm-zero.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P0/sm-zero.png
--- a/src/web/staticres/common-module/yearEndReport/images/P0/xd-zero.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P0/xd-zero.png
--- a/src/web/staticres/common-module/yearEndReport/images/P1/bottom-bg.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P1/bottom-bg.png
--- a/src/web/staticres/common-module/yearEndReport/images/P1/meteor-mini.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P1/meteor-mini.png
--- a/src/web/staticres/common-module/yearEndReport/images/P1/meteor.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P1/meteor.png
--- a/src/web/staticres/common-module/yearEndReport/images/P10/big-ten.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P10/big-ten.png
--- a/src/web/staticres/common-module/yearEndReport/images/P10/fish-ten.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P10/fish-ten.png
--- a/src/web/staticres/common-module/yearEndReport/images/P10/pao-ten.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P10/pao-ten.png
--- a/src/web/staticres/common-module/yearEndReport/images/P10/sm-ten.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P10/sm-ten.png
--- a/src/web/staticres/common-module/yearEndReport/images/P11/ball-eleven.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P11/ball-eleven.png
--- a/src/web/staticres/common-module/yearEndReport/images/P11/fish-eleven.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P11/fish-eleven.png
--- a/src/web/staticres/common-module/yearEndReport/images/P11/sm-star-eleven.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P11/sm-star-eleven.png
--- a/src/web/staticres/common-module/yearEndReport/images/P12/big-star-twelve.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P12/big-star-twelve.png
--- a/src/web/staticres/common-module/yearEndReport/images/P12/sm-star-twelve.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P12/sm-star-twelve.png
--- a/src/web/staticres/common-module/yearEndReport/images/P12/xd-twelve.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P12/xd-twelve.png
--- a/src/web/staticres/common-module/yearEndReport/images/P2/ball-two.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P2/ball-two.png
--- a/src/web/staticres/common-module/yearEndReport/images/P2/fish-two.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P2/fish-two.png
--- a/src/web/staticres/common-module/yearEndReport/images/P2/star-two.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P2/star-two.png
--- a/src/web/staticres/common-module/yearEndReport/images/P2/tail-two.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P2/tail-two.png
--- a/src/web/staticres/common-module/yearEndReport/images/P3/ball-three.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P3/ball-three.png
--- a/src/web/staticres/common-module/yearEndReport/images/P3/star-three.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P3/star-three.png
--- a/src/web/staticres/common-module/yearEndReport/images/P3/yellow-three.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P3/yellow-three.png
--- a/src/web/staticres/common-module/yearEndReport/images/P4/big-four.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P4/big-four.png
--- a/src/web/staticres/common-module/yearEndReport/images/P4/fish-four.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P4/fish-four.png
--- a/src/web/staticres/common-module/yearEndReport/images/P4/sm-four.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P4/sm-four.png
--- a/src/web/staticres/common-module/yearEndReport/images/P5/aoyi-five.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P5/aoyi-five.png
--- a/src/web/staticres/common-module/yearEndReport/images/P5/ball-five.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P5/ball-five.png
--- a/src/web/staticres/common-module/yearEndReport/images/P5/fish-five.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P5/fish-five.png
--- a/src/web/staticres/common-module/yearEndReport/images/P5/yun-five.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P5/yun-five.png
--- a/src/web/staticres/common-module/yearEndReport/images/P6/ball-six.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P6/ball-six.png
--- a/src/web/staticres/common-module/yearEndReport/images/P6/fish-six.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P6/fish-six.png
--- a/src/web/staticres/common-module/yearEndReport/images/P6/group-six.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P6/group-six.png
--- a/src/web/staticres/common-module/yearEndReport/images/P6/xd-six.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P6/xd-six.png
--- a/src/web/staticres/common-module/yearEndReport/images/P7/xd-seven.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P7/xd-seven.png
--- a/src/web/staticres/common-module/yearEndReport/images/P8/ball-eight.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P8/ball-eight.png
--- a/src/web/staticres/common-module/yearEndReport/images/P8/xd-eight.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P8/xd-eight.png
--- a/src/web/staticres/common-module/yearEndReport/images/P9/ball-nine.png
+++ b/src/web/staticres/common-module/yearEndReport/images/P9/ball-nine.png
--- a/src/web/staticres/common-module/yearEndReport/images/music/music-off.png
+++ b/src/web/staticres/common-module/yearEndReport/images/music/music-off.png
--- a/src/web/staticres/common-module/yearEndReport/images/music/music.png
+++ b/src/web/staticres/common-module/yearEndReport/images/music/music.png
--- a/src/web/staticres/common-module/yearEndReport/images/next/next.png
+++ b/src/web/staticres/common-module/yearEndReport/images/next/next.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/ball.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/ball.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/bg.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/bg.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/create-btn.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/create-btn.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/item-bg-1.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/item-bg-1.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/item-bg-2.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/item-bg-2.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/item-bg-3.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/item-bg-3.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/item-bg-4.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/item-bg-4.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/item-bg-5.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/item-bg-5.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/item-bg-6.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/item-bg-6.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/item-bg-7.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/item-bg-7.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/jy-logo.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/jy-logo.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/jy-qcode.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/jy-qcode.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/label-1.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/label-1.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/label-2.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/label-2.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/label-3.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/label-3.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/label-4.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/label-4.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/label-5.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/label-5.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/label-6.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/label-6.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/label-7.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/label-7.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/label-8.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/label-8.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/label-9.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/label-9.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/music.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/music.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/share-btn.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/share-btn.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/star.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/star.png
--- a/src/web/staticres/common-module/yearEndReport/images/result/superman.png
+++ b/src/web/staticres/common-module/yearEndReport/images/result/superman.png
--- a/src/web/staticres/common-module/yearEndReport/js/common.js
+++ b/src/web/staticres/common-module/yearEndReport/js/common.js
@@ -0,0 +1,723 @@
 
				+var utils = {
			
 
				+  // utils版本号
			
 
				+  version: '0.0.3',
			
 
				+  isWeiXinBrowser: navigator.userAgent.toLowerCase().indexOf('micromessenger') !== -1,
			
 
				+  isAndroid: navigator.userAgent.toLowerCase().indexOf('android') !== -1,
			
 
				+  isIos: /iphone|ipod|ipad|ios/.test(navigator.userAgent.toLowerCase()),
			
 
				+  // 传入你要获取的参数的名字
			
 
				+  getParam: function (name) {
			
 
				+    var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
			
 
				+    var r = window.location.search.substr(1).match(reg); //获取url中'?'符后的字符串并正则匹配
			
 
				+
			
 
				+    var context = '';
			
 
				+    if (r != null) context = r[2];
			
 
				+    // 释放变量
			
 
				+    reg = null;
			
 
				+    r = null;
			
 
				+    return context == null || context == '' || context == 'undefined' ? '' : context;
			
 
				+  },
			
 
				+  // 取[m, n]随机数
			
 
				+  getRandomNumber: function (min, max) {
			
 
				+    return Math.floor(Math.random() * (max - min + 1) + min);
			
 
				+  },
			
 
				+  // 获取唯一的uuid
			
 
				+  // https://www.kancloud.cn/ifeng/js100/622666
			
 
				+  getRandomUuid: function () {
			
 
				+    var s = [];
			
 
				+    var hexDigits = "0123456789abcdef";
			
 
				+    for (var i = 0; i < 36; i++) {
			
 
				+      s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
			
 
				+    }
			
 
				+    s[14] = "4";  // bits 12-15 of the time_hi_and_version field to 0010
			
 
				+    s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1);  // bits 6-7 of the clock_seq_hi_and_reserved to 01
			
 
				+    s[8] = s[13] = s[18] = s[23] = "-";
			
 
				+
			
 
				+    var uuid = s.join("");
			
 
				+    return uuid;
			
 
				+  },
			
 
				+  // 获取随机字符串
			
 
				+  // 不传参数则获取长度不固定的字符串
			
 
				+  getRandomString: function (len) {
			
 
				+    var randomString = '';
			
 
				+    if (len) {
			
 
				+      /****默认去掉了容易混淆的字符oOLl,9gq,Vv,Uu,I1****/
			
 
				+      var $chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678';
			
 
				+      var maxPos = $chars.length;
			
 
				+      for (i = 0; i < len; i++) {
			
 
				+        randomString += $chars.charAt(Math.floor(Math.random() * maxPos));
			
 
				+      }
			
 
				+    } else {
			
 
				+      // Math.random()  生成随机数字, eg: 0.123456
			
 
				+      // .toString(36)  转化成36进制 : "0.4fzyo82mvyr"
			
 
				+      // .substring(2)  去掉前面两位 : "yo82mvyr"
			
 
				+      // .slice(-8)  截取最后八位 : "yo82mvyr"
			
 
				+      randomString = Math.random().toString(36).substring(2)
			
 
				+    }
			
 
				+    return randomString;
			
 
				+  },
			
 
				+  // FROM: https://www.jianshu.com/p/90ed8b728975
			
 
				+  // 比较两个对象是否相等
			
 
				+  // 返回true为相等，返回false为不相等
			
 
				+  deepCompare: function (x, y) {
			
 
				+    var i, l, leftChain, rightChain;
			
 
				+    function compare2Objects(x, y) {
			
 
				+      var p;
			
 
				+      // remember that NaN === NaN returns false
			
 
				+      // and isNaN(undefined) returns true
			
 
				+      if (isNaN(x) && isNaN(y) && typeof x === 'number' && typeof y === 'number') {
			
 
				+        return true;
			
 
				+      }
			
 
				+
			
 
				+      // Compare primitives and functions.
			
 
				+      // Check if both arguments link to the same object.
			
 
				+      // Especially useful on the step where we compare prototypes
			
 
				+      if (x === y) {
			
 
				+        return true;
			
 
				+      }
			
 
				+
			
 
				+      // Works in case when functions are created in constructor.
			
 
				+      // Comparing dates is a common scenario. Another built-ins?
			
 
				+      // We can even handle functions passed across iframes
			
 
				+      if ((typeof x === 'function' && typeof y === 'function') ||
			
 
				+        (x instanceof Date && y instanceof Date) ||
			
 
				+        (x instanceof RegExp && y instanceof RegExp) ||
			
 
				+        (x instanceof String && y instanceof String) ||
			
 
				+        (x instanceof Number && y instanceof Number)) {
			
 
				+        return x.toString() === y.toString();
			
 
				+      }
			
 
				+
			
 
				+      // At last checking prototypes as good as we can
			
 
				+      if (!(x instanceof Object && y instanceof Object)) {
			
 
				+        return false;
			
 
				+      }
			
 
				+
			
 
				+      if (x.isPrototypeOf(y) || y.isPrototypeOf(x)) {
			
 
				+        return false;
			
 
				+      }
			
 
				+
			
 
				+      if (x.constructor !== y.constructor) {
			
 
				+        return false;
			
 
				+      }
			
 
				+
			
 
				+      if (x.prototype !== y.prototype) {
			
 
				+        return false;
			
 
				+      }
			
 
				+
			
 
				+      // Check for infinitive linking loops
			
 
				+      if (leftChain.indexOf(x) > -1 || rightChain.indexOf(y) > -1) {
			
 
				+        return false;
			
 
				+      }
			
 
				+
			
 
				+      // Quick checking of one object being a subset of another.
			
 
				+      // todo: cache the structure of arguments[0] for performance
			
 
				+      for (p in y) {
			
 
				+        if (y.hasOwnProperty(p) !== x.hasOwnProperty(p)) {
			
 
				+          return false;
			
 
				+        } else if (typeof y[p] !== typeof x[p]) {
			
 
				+          return false;
			
 
				+        }
			
 
				+      }
			
 
				+
			
 
				+      for (p in x) {
			
 
				+        if (y.hasOwnProperty(p) !== x.hasOwnProperty(p)) {
			
 
				+          return false;
			
 
				+        } else if (typeof y[p] !== typeof x[p]) {
			
 
				+          return false;
			
 
				+        }
			
 
				+
			
 
				+        switch (typeof (x[p])) {
			
 
				+          case 'object':
			
 
				+          case 'function':
			
 
				+
			
 
				+            leftChain.push(x);
			
 
				+            rightChain.push(y);
			
 
				+
			
 
				+            if (!compare2Objects(x[p], y[p])) {
			
 
				+              return false;
			
 
				+            }
			
 
				+
			
 
				+            leftChain.pop();
			
 
				+            rightChain.pop();
			
 
				+            break;
			
 
				+
			
 
				+          default:
			
 
				+            if (x[p] !== y[p]) {
			
 
				+              return false;
			
 
				+            }
			
 
				+            break;
			
 
				+        }
			
 
				+      }
			
 
				+
			
 
				+      return true;
			
 
				+    }
			
 
				+
			
 
				+    if (arguments.length < 1) {
			
 
				+      return true; //Die silently? Don't know how to handle such case, please help...
			
 
				+      // throw "Need two or more arguments to compare";
			
 
				+    }
			
 
				+
			
 
				+    for (i = 1, l = arguments.length; i < l; i++) {
			
 
				+
			
 
				+      leftChain = []; //Todo: this can be cached
			
 
				+      rightChain = [];
			
 
				+
			
 
				+      if (!compare2Objects(arguments[0], arguments[i])) {
			
 
				+        return false;
			
 
				+      }
			
 
				+    }
			
 
				+
			
 
				+    return true;
			
 
				+  },
			
 
				+  // 判断变量是否是数组
			
 
				+  isArray: function (o) {
			
 
				+    return Object.prototype.toString.call(o) == '[object Array]';
			
 
				+  },
			
 
				+  // 数组对象根据某一个值进行从小到大冒泡排序
			
 
				+  // arr 数组
			
 
				+  // value 字符串
			
 
				+  bSort: function (arr, value) {
			
 
				+    var len = arr.length;
			
 
				+    for (var i = 0; i < len - 1; i++) {
			
 
				+      for (var j = 0; j < len - 1 - i; j++) {
			
 
				+        // 相邻元素两两对比，元素交换，大的元素交换到后面
			
 
				+        if (arr[j][value] > arr[j + 1][value]) {
			
 
				+          var temp = arr[j];
			
 
				+          arr[j] = arr[j + 1];
			
 
				+          arr[j + 1] = temp;
			
 
				+        }
			
 
				+      }
			
 
				+    }
			
 
				+    return arr;
			
 
				+  },
			
 
				+  // 数组去重
			
 
				+  unique: function (arr) {
			
 
				+    if (!this.isArray(arr)) {
			
 
				+      console.log('type error!')
			
 
				+      return
			
 
				+    }
			
 
				+    var array = [];
			
 
				+    for (var i = 0; i < arr.length; i++) {
			
 
				+      if (array.indexOf(arr[i]) === -1) {
			
 
				+        array.push(arr[i])
			
 
				+      }
			
 
				+    }
			
 
				+    return array
			
 
				+  },
			
 
				+  // 数组乱序
			
 
				+  shuffle: function (arr) {
			
 
				+    var targetArr = JSON.parse(JSON.stringify(arr || []))
			
 
				+    var hitArr = []
			
 
				+    var len = targetArr.length
			
 
				+    for (var i = 0; i < len; i++) {
			
 
				+      // 获取随机下标
			
 
				+      var index = Math.floor(Math.random() * targetArr.length)
			
 
				+      hitArr.push(targetArr[index])
			
 
				+      targetArr.splice(index, 1)
			
 
				+    }
			
 
				+    return hitArr.concat(targetArr)
			
 
				+  },
			
 
				+  // 解决ios返回不刷新页面的问题
			
 
				+  iosBackRefresh: function () {
			
 
				+    var isPageHide = false;
			
 
				+    let superSearch_iosNoRefresh = sessionStorage.getItem('superSearch_iosNoRefresh')
			
 
				+    window.addEventListener('pageshow', function () {
			
 
				+      if (isPageHide) {
			
 
				+        // ios从三级页返回不刷新页面
			
 
				+        if (!superSearch_iosNoRefresh) {
			
 
				+          location.reload();
			
 
				+        } else {
			
 
				+          sessionStorage.removeItem('superSearch_iosNoRefresh')
			
 
				+        }
			
 
				+      } else {
			
 
				+        if (superSearch_iosNoRefresh) {
			
 
				+          sessionStorage.removeItem('superSearch_iosNoRefresh')
			
 
				+        }
			
 
				+      }
			
 
				+    });
			
 
				+    window.addEventListener('pagehide', function () {
			
 
				+      isPageHide = true;
			
 
				+    });
			
 
				+  },
			
 
				+  // ios返回调用函数
			
 
				+  iosBackInvoke: function (callback) {
			
 
				+    var isPageHide = false;
			
 
				+    window.addEventListener('pageshow', function () {
			
 
				+      if (isPageHide) {
			
 
				+        callback && callback();
			
 
				+      }
			
 
				+    });
			
 
				+    window.addEventListener('pagehide', function () {
			
 
				+      isPageHide = true;
			
 
				+    });
			
 
				+  },
			
 
				+  /**
			
 
				+   * 格式化金钱的函数
			
 
				+   * @param {number} s 金额必传
			
 
				+   * @param {int:0-100} n 保留小数的位数(int:0-100)
			
 
				+   * @param {Boolean} withoutComma 传true则表示不使用,分割返回值
			
 
				+   */
			
 
				+  formatMoney: function (s, n, withoutComma) {
			
 
				+    // 如果不传s或者s为空，则直接返回0
			
 
				+    if (!s) return 0
			
 
				+
			
 
				+    if (n === undefined || n === null) {
			
 
				+      n = -1
			
 
				+    } else {
			
 
				+      n = n > 0 && n <= 20 ? n : 2;
			
 
				+    }
			
 
				+    var intS = parseInt(s)
			
 
				+    var point = '.'
			
 
				+    var left;
			
 
				+    var right;
			
 
				+    s = parseFloat((s + '').replace(/[^\d\.-]/g, ''))
			
 
				+    // 没传n，默认(如果为整数，则不保留小数。如果为浮点数，则保留两位小数)
			
 
				+    if (n === -1) {
			
 
				+      if (s === intS) {
			
 
				+        n = 0
			
 
				+        right = ''
			
 
				+        point = ''
			
 
				+      } else {
			
 
				+        n = 2
			
 
				+        s = s.toFixed(n);
			
 
				+        right = s.split('.')[1];
			
 
				+      }
			
 
				+      s = s + ''
			
 
				+      left = s.split('.')[0].split('').reverse();
			
 
				+    } else {
			
 
				+      s = parseFloat((s + '').replace(/[^\d\.-]/g, '')).toFixed(n) + '';
			
 
				+      left = s.split('.')[0].split('').reverse();
			
 
				+      right = s.split('.')[1];
			
 
				+    }
			
 
				+
			
 
				+    // 默认进行,拼接
			
 
				+    if (!withoutComma) {
			
 
				+      t = '';
			
 
				+      for (i = 0; i < left.length; i++) {
			
 
				+        t += left[i] + ((i + 1) % 3 == 0 && (i + 1) != left.length ? ',' : '');
			
 
				+      }
			
 
				+      return t.split('').reverse().join('') + point + right;
			
 
				+    }
			
 
				+
			
 
				+    return left.reverse().join('') + point + right;;
			
 
				+  },
			
 
				+  // 金额大写，链接：https://juejin.im/post/5a2a7a5051882535cd4abfce
			
 
				+  // upDigit(1682) result："人民币壹仟陆佰捌拾贰元整"
			
 
				+  // upDigit(-1693) result："欠壹仟陆佰玖拾叁元整"
			
 
				+  upPrice: function (n) {
			
 
				+    var fraction = ['角', '分', '厘']
			
 
				+    var digit = ['零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖']
			
 
				+    var unit = [
			
 
				+      ['元', '万', '亿'],
			
 
				+      ['', '拾', '佰', '仟']
			
 
				+    ]
			
 
				+    // var head = n < 0 ? '欠人民币' : '人民币'
			
 
				+    var head = ''
			
 
				+    n = Math.abs(n)
			
 
				+    var s = ''
			
 
				+    for (var i = 0; i < fraction.length; i++) {
			
 
				+      s += (digit[Math.floor(n * 10 * Math.pow(10, i)) % 10] + fraction[i]).replace(/零./, '')
			
 
				+    }
			
 
				+    s = s || '整'
			
 
				+    n = Math.floor(n)
			
 
				+    for (var i = 0; i < unit[0].length && n > 0; i++) {
			
 
				+      var p = ''
			
 
				+      for (var j = 0; j < unit[1].length && n > 0; j++) {
			
 
				+        p = digit[n % 10] + unit[1][j] + p
			
 
				+        n = Math.floor(n / 10)
			
 
				+      }
			
 
				+      s = p.replace(/(零.)*零$/, '').replace(/^$/, '零') + unit[0][i] + s
			
 
				+      // s = p + unit[0][i] + s;
			
 
				+    }
			
 
				+    return head + s.replace(/(零.)*零元/, '元').replace(/(零.)+/g, '零').replace(/^整$/, '零元整')
			
 
				+  },
			
 
				+  // 手机号中间4位加*
			
 
				+  addConfusionForTel: function (tel) {
			
 
				+    var reg = /^(\d{3})\d{4}(\d{4})$/
			
 
				+    return tel.replace(reg, '$1****$2')
			
 
				+  },
			
 
				+  // 手机号加空格
			
 
				+  addSpaceForTel: function (tel) {
			
 
				+    var regMap = {
			
 
				+      isConfuse: /^(\d{3})\*{4}(\d{4})$/,
			
 
				+      addSpace: /^(\d{3})(\d{4})(\d{4})$/
			
 
				+    }
			
 
				+    var confusion = regMap.isConfuse.test(tel)
			
 
				+    if (confusion) {
			
 
				+      return tel.replace(regMap.isConfuse, '$1 **** $2')
			
 
				+    } else {
			
 
				+      return tel.replace(regMap.addSpace, '$1 $2 $3')
			
 
				+    }
			
 
				+  },
			
 
				+  /**
			
 
				+   * 时间戳转换 多少秒、多少分、多少小时前  昨天以及昨天之前的显示年月日（今年的时间不显示年份）
			
 
				+   * @param {Date} originTime 要转换的时间对象(或者时间戳)
			
 
				+   */
			
 
				+  dateFromNow: function (originTime, useOld) {
			
 
				+    if (!originTime) return
			
 
				+    // 原始时间 - 传入的时间戳
			
 
				+    var originTimeStamp = +new Date(originTime)
			
 
				+    // 当前时间戳
			
 
				+    var nowTimeStamp = +new Date()
			
 
				+    // 时间戳相差多少
			
 
				+    var diffTimeStamp = nowTimeStamp - originTimeStamp
			
 
				+
			
 
				+    var postfix = diffTimeStamp > 0 ? '前' : '后'
			
 
				+    // 求绝对值 ms(毫秒)
			
 
				+    var diffTimeStampAbsMs = Math.abs(diffTimeStamp)
			
 
				+    var diffTimeStampAbsS = Math.round(diffTimeStampAbsMs / 1000)
			
 
				+
			
 
				+    // 10天的秒数
			
 
				+    var days11 = 11 * 24 * 60 * 60
			
 
				+    // var dataMap = {
			
 
				+    //     zh: ['年', '个月', '星期', '天', '小时', '分钟', '秒'],
			
 
				+    //     number: [365*24*60*60, 30*24*60*60, 7*24*60*60, 24*60*60, 60*60, 60, 1]
			
 
				+    // }
			
 
				+    var dataMap = {
			
 
				+      zh: ['天', '小时', '分钟', '秒'],
			
 
				+      number: [24 * 60 * 60, 60 * 60, 60, 1]
			
 
				+    }
			
 
				+
			
 
				+    var timeString = ''
			
 
				+    // 10天前
			
 
				+    var tenDaysAgo = diffTimeStampAbsS > days11
			
 
				+    // 是否是当天
			
 
				+    var isCurrentDay = new Date(originTimeStamp).pattern('yyyy.MM.dd') === new Date().pattern('yyyy.MM.dd')
			
 
				+
			
 
				+    var condition = !isCurrentDay
			
 
				+    if (useOld) {
			
 
				+      condition = tenDaysAgo
			
 
				+    }
			
 
				+
			
 
				+    if (condition) {
			
 
				+      // 不是当天，则使用正常日期显示
			
 
				+      var originDate = new Date(originTimeStamp)
			
 
				+      var nowDate = new Date()
			
 
				+      // 是否同年
			
 
				+      var sameYear = originDate.getFullYear() === nowDate.getFullYear()
			
 
				+      // 如果是当年，则不显示年
			
 
				+      var patternString = sameYear ? 'MM-dd' : 'yyyy-MM-dd'
			
 
				+      timeString = originDate.pattern(patternString)
			
 
				+    } else {
			
 
				+      for (var i = 0; i < dataMap.number.length; i++) {
			
 
				+        var inm = Math.floor(diffTimeStampAbsS / dataMap.number[i])
			
 
				+        if (inm != 0) {
			
 
				+          timeString = inm + dataMap.zh[i] + postfix
			
 
				+          break
			
 
				+        }
			
 
				+      }
			
 
				+    }
			
 
				+    return timeString
			
 
				+  },
			
 
				+  /**
			
 
				+   * 输入框获取焦点，隐藏底部固定按钮方法
			
 
				+   * @param {Array} inputs 传入输入框的DOM对象
			
 
				+   * @param {Object} footer 按键弹起要隐藏的footer的 DOM对象
			
 
				+   */
			
 
				+  inputFocusHideFooter: function (inputs, footer) {
			
 
				+    var isShowBtn = function (f) {
			
 
				+      if (f) {
			
 
				+        footer.style.display = ''
			
 
				+      } else {
			
 
				+        footer.style.display = 'none'
			
 
				+      }
			
 
				+    }
			
 
				+
			
 
				+    // ios监听输入框的软键盘弹起和收起事件
			
 
				+    if (this.isIos) {
			
 
				+      inputs.forEach(function (item) {
			
 
				+        item.addEventListener('focus', function () {
			
 
				+          console.log('IOS 键盘弹出')
			
 
				+          // IOS 键盘弹起后操作
			
 
				+          isShowBtn(false)
			
 
				+        }, false)
			
 
				+
			
 
				+        // IOS 键盘收起：IOS 点击输入框以外区域或点击收起按钮，输入框都会失去焦点，键盘会收起，
			
 
				+        item.addEventListener('blur', function () {
			
 
				+          console.log('IOS 键盘收起')
			
 
				+          // IOS 键盘收起后操作
			
 
				+          isShowBtn(true)
			
 
				+        })
			
 
				+      })
			
 
				+    }
			
 
				+
			
 
				+    // Android 键盘收起：Android 键盘弹起或收起页面高度会发生变化，以此为依据获知键盘收起
			
 
				+    if (this.isAndroid) {
			
 
				+      var clientHeight = document.documentElement.clientHeight || document.body.clientHeight
			
 
				+      window.addEventListener('resize', function () {
			
 
				+        var nowClientHeight = document.documentElement.clientHeight || document.body.clientHeight
			
 
				+        if (clientHeight > nowClientHeight) {
			
 
				+          // 键盘弹出的事件处理
			
 
				+          console.log('Android 键盘弹出')
			
 
				+          isShowBtn(false)
			
 
				+        } else {
			
 
				+          console.log('Android 键盘收起')
			
 
				+          // 键盘收起的事件处理
			
 
				+          isShowBtn(true)
			
 
				+        }
			
 
				+      }, false)
			
 
				+    }
			
 
				+  },
			
 
				+  /**
			
 
				+   * 通用关键字高亮替换
			
 
				+   * @param {String} value 要高亮的字符串
			
 
				+   * @param {String|Array} oldChar 要被替换的字符串(或数组)
			
 
				+   * @param {String|Array} newChar 要替换成的字符串(或数组)
			
 
				+   *
			
 
				+   * 比如：要将 - `剑鱼标讯工具函数` 字符串中的 `工具` 高亮
			
 
				+   * 则此时 value -> `剑鱼标讯工具函数`
			
 
				+   *        oldChar -> `工具`
			
 
				+   *        newChar -> `<span class="highlight-text">工具</span>`
			
 
				+   *
			
 
				+   * 批量高亮-----
			
 
				+   * 比如：要将 - `剑鱼标讯工具函数` 字符串中的 `工具` `剑鱼` 高亮
			
 
				+   * 则此时 value -> `剑鱼标讯工具函数批量高亮`
			
 
				+   *        oldChar -> ['工具', '剑鱼']
			
 
				+   *        newChar -> ['<span class="highlight-text">', '</span>']
			
 
				+   *
			
 
				+   *   注意：此时newChar为一个长度为2的数组，数组中为高亮标签的起始标签和结束标签
			
 
				+   *
			
 
				+   */
			
 
				+  replaceKeyword: function (value, oldChar, newChar) {
			
 
				+    var _this = this
			
 
				+    if (!oldChar || !newChar) return value
			
 
				+    // oldChar的字符串数组，用来循环替换
			
 
				+    var oldCharArr = []
			
 
				+
			
 
				+    if (this.isArray(oldChar)) {
			
 
				+      oldCharArr = oldChar.concat()
			
 
				+    } else {
			
 
				+      oldCharArr.push(oldChar)
			
 
				+    }
			
 
				+
			
 
				+    // 数组去重
			
 
				+    oldCharArr = this.unique(oldCharArr)
			
 
				+
			
 
				+    try {
			
 
				+      oldCharArr.forEach(function (item) {
			
 
				+        // 去空格之后为空字符串，则直接跳过当前替换
			
 
				+        if (item.replace(/\s+/g, '')) {
			
 
				+          var oc = item
			
 
				+          oc = oc.replace(/\$/g, '\\$')
			
 
				+            .replace(/\(/g, '\\(')
			
 
				+            .replace(/\)/g, '\\)')
			
 
				+            .replace(/\*/g, '\\*')
			
 
				+            .replace(/\+/g, '\\+')
			
 
				+            .replace(/\./g, '\\.')
			
 
				+            .replace(/\[/g, '\\[')
			
 
				+            .replace(/\]/g, '\\]')
			
 
				+            .replace(/\?/g, '\\?')
			
 
				+            .replace(/\\/g, '\\')
			
 
				+            .replace(/\//g, '\\/')
			
 
				+            .replace(/\^/g, '\\^')
			
 
				+            .replace(/\{/g, '\\{')
			
 
				+            .replace(/\}/g, '\\}')
			
 
				+            .replace(/\|/g, '\\|')
			
 
				+
			
 
				+          if (_this.isArray(newChar)) {
			
 
				+            // 批量高亮
			
 
				+            var tempV = value
			
 
				+            value = value.replace(new RegExp('(' + oc + ')', 'gmi'), newChar[0] + oc + newChar[1])
			
 
				+            if (value === tempV && oc.indexOf('+') !== -1) {
			
 
				+              var splitReg = oc.split('\\+')
			
 
				+              splitReg.map(function (v) {
			
 
				+                value = value.replace(new RegExp('(' + v + ')', 'gmi'), newChar[0] + v + newChar[1])
			
 
				+              })
			
 
				+            }
			
 
				+          } else {
			
 
				+            // 普通单个高亮
			
 
				+            value = value.replace(new RegExp('(' + oc + ')', 'gmi'), newChar)
			
 
				+          }
			
 
				+        }
			
 
				+      })
			
 
				+    } catch (e) {
			
 
				+      console.log(e)
			
 
				+      return value
			
 
				+    }
			
 
				+    return value
			
 
				+  },
			
 
				+  /**
			
 
				+   * 批量删除sessionStorage中的数据
			
 
				+   * @param {RegExp} reg 传入一个要匹配的正则表达式
			
 
				+   */
			
 
				+  clearBatchSessionStorage: function (reg) {
			
 
				+    if (sessionStorage) {
			
 
				+      var sessKeys = Object.keys(sessionStorage)
			
 
				+      sessKeys.forEach(function (item) {
			
 
				+        if (reg.test(item)) {
			
 
				+          sessionStorage.removeItem(item)
			
 
				+        }
			
 
				+      })
			
 
				+    }
			
 
				+  },
			
 
				+  /**
			
 
				+   * 获取图片原始宽高
			
 
				+   * @param {Image/Object} img
			
 
				+   * @param {Function} callback
			
 
				+   */
			
 
				+  getImgNaturalDimensions: function (img, callback) {
			
 
				+    var naturalSize = {}
			
 
				+    if (img.naturalWidth && img.naturalHeight) { // 现代浏览器
			
 
				+      naturalSize.with = img.naturalWidth
			
 
				+      naturalSize.height = img.naturalHeight
			
 
				+    } else { // IE6/7/8
			
 
				+      var image = new Image()
			
 
				+      image.src = img.src
			
 
				+      image.onload = function () {
			
 
				+        naturalSize.with = image.width
			
 
				+        naturalSize.height = image.height
			
 
				+        callback && callback(naturalSize)
			
 
				+      }
			
 
				+    }
			
 
				+    return naturalSize
			
 
				+  },
			
 
				+  moneyUnit: function (num, type, lv) {
			
 
				+    if (num === '' || num == null || num == undefined || isNaN(num)) return ''
			
 
				+    var levelArr = ['元', '万元', '亿元', '万亿元']
			
 
				+    if (type === void 0) {
			
 
				+      type = 'string';
			
 
				+    }
			
 
				+
			
 
				+    if (lv === void 0) {
			
 
				+      lv = 0;
			
 
				+    }
			
 
				+
			
 
				+    if (num === 0) {
			
 
				+      if (type === 'string') {
			
 
				+        return '0';
			
 
				+      }
			
 
				+
			
 
				+      if (type === 'lv') {
			
 
				+        return levelArr[lv];
			
 
				+      }
			
 
				+
			
 
				+      if (type === 'number') {
			
 
				+        return 0;
			
 
				+      }
			
 
				+
			
 
				+      if (type === 'index') {
			
 
				+        return lv;
			
 
				+      }
			
 
				+    }
			
 
				+
			
 
				+    // 需要传入固定的lv（此时lv为 levelArr 中的一个）
			
 
				+    function transfer(num, lvString) {
			
 
				+      var index = levelArr.indexOf(lvString)
			
 
				+      if (index === -1 || index === 0) {
			
 
				+        return num
			
 
				+      } else {
			
 
				+        return (num / Math.pow(10000, index)).toFixed(2) + lvString
			
 
				+      }
			
 
				+    }
			
 
				+
			
 
				+    if (type === 'transfer') {
			
 
				+      return transfer(num, lv)
			
 
				+    }
			
 
				+
			
 
				+    var result = num / Math.pow(10000, lv);
			
 
				+
			
 
				+    if (result > 10000 && lv < 2) {
			
 
				+      return this.moneyUnit(num, type, lv + 1)
			
 
				+    } else {
			
 
				+      if (type === 'string') {
			
 
				+        return String(Math.floor(result * 100) / 100).replace('.00', '') + levelArr[lv];
			
 
				+      }
			
 
				+
			
 
				+      if (type === 'lv') {
			
 
				+        return levelArr[lv];
			
 
				+      }
			
 
				+
			
 
				+      if (type === 'index') {
			
 
				+        return lv;
			
 
				+      }
			
 
				+
			
 
				+      if (type === 'number') {
			
 
				+        return String(Math.floor(result * 100) / 100).replace('.00', '');
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  /**
			
 
				+   * 防抖
			
 
				+   * @param {Function} func 函数
			
 
				+   * @param {Number} delay 延时间隔 默认 200ms
			
 
				+   * @param {Boolean} immediate 是否首次执行
			
 
				+   */
			
 
				+  debounce: function (func, delay, immediate) {
			
 
				+    var timer = null;
			
 
				+    delay = delay || 200
			
 
				+    return function () {
			
 
				+      var context = this;
			
 
				+      var args = arguments;
			
 
				+      if (timer) clearTimeout(timer);
			
 
				+      if (immediate) {
			
 
				+        var doNow = !timer;
			
 
				+        timer = setTimeout(function () {
			
 
				+          timer = null;
			
 
				+        }, delay);
			
 
				+        if (doNow) {
			
 
				+          func.apply(context, args);
			
 
				+        }
			
 
				+      } else {
			
 
				+        timer = setTimeout(function () {
			
 
				+          func.apply(context, args);
			
 
				+        }, delay);
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+$(function () {
			
 
				+  if (utils.isIos) {
			
 
				+    window.JyObj = {
			
 
				+      //获取经纬度
			
 
				+      getLLitude: function () {
			
 
				+        return JyObj.IosCall("getLLitude")
			
 
				+      },
			
 
				+      savePic: function (imgbase64) {
			
 
				+        JyObjMessage.imgbase64 = imgbase64
			
 
				+        window.webkit.messageHandlers.savePic.postMessage(JyObjMessage)
			
 
				+        JyObj.clearMessage()
			
 
				+      },
			
 
				+      //抖音or快手其他应用appName：应用名称；appLink：应用链接
			
 
				+      openOtherAppLinks: function (appName, appLink) {
			
 
				+        JyObjMessage["appName"] = appName;
			
 
				+        JyObjMessage["appLink"] = appLink;
			
 
				+        window.webkit.messageHandlers.openOtherAppLinks.postMessage(JyObjMessage);
			
 
				+        JyObj.clearMessage();
			
 
				+      },
			
 
				+      //隐藏显示底部菜单栏 0：隐藏；1：显示
			
 
				+      hiddenBottom: function (val) {
			
 
				+        JyObjMessage["hidden"] = val;
			
 
				+        window.webkit.messageHandlers.hiddenBottom.postMessage(JyObjMessage);
			
 
				+        JyObj.clearMessage();
			
 
				+      },
			
 
				+      //分享功能
			
 
				+      share: function (type, title, content, link) {
			
 
				+        JyObjMessage["type"] = type
			
 
				+        JyObjMessage["title"] = title
			
 
				+        JyObjMessage["content"] = content
			
 
				+        JyObjMessage["link"] = link
			
 
				+        window.webkit.messageHandlers.share.postMessage(JyObjMessage);
			
 
				+        JyObj.clearMessage();
			
 
				+      },
			
 
				+      //跳转外部链接
			
 
				+      openExternalLink: function (url, title) {
			
 
				+        JyObjMessage["url"] = url
			
 
				+        JyObjMessage["title"] = title
			
 
				+        window.webkit.messageHandlers.openExternalLink.postMessage(JyObjMessage);
			
 
				+        JyObj.clearMessage();
			
 
				+      },
			
 
				+      //是否安装了微信
			
 
				+      isInstallWeixin: function () {
			
 
				+        return JyObj.IosCall("isInstallWeixin")
			
 
				+      },
			
 
				+      //获取定位
			
 
				+      getLocation: function () {
			
 
				+        return JyObj.IosCall("getLocation")
			
 
				+      },
			
 
				+      //查看定位开关状态 是否开启
			
 
				+      checkLocationPermission: function () {
			
 
				+        return JyObj.IosCall("checkLocationPermission")
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+})
			
--- a/src/web/staticres/common-module/yearEndReport/js/rem.js
+++ b/src/web/staticres/common-module/yearEndReport/js/rem.js
@@ -0,0 +1,29 @@
 
				+(function(doc, win) {
			
 
				+	var docEl = doc.documentElement,
			
 
				+		resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
			
 
				+		recalc = function() {
			
 
				+			var fontSize = RootNodeFontSize();
			
 
				+			if(fontSize == 0) return;
			
 
				+			docEl.style.fontSize = fontSize + 'px';
			
 
				+		};
			
 
				+	if(!doc.addEventListener) return;
			
 
				+	win.addEventListener(resizeEvt, recalc, false);
			
 
				+	doc.addEventListener('DOMContentLoaded', recalc, false);
			
 
				+})(document, window);
			
 
				+//获取根节点的font-size
			
 
				+function RootNodeFontSize(){
			
 
				+	var clientWidth = document.documentElement.clientWidth;
			
 
				+  var clientHeight = document.documentElement.clientHeight
			
 
				+	if(!clientWidth) return 0;
			
 
				+	if(clientWidth > 914) clientWidth = 914;
			
 
				+
			
 
				+  var originwCh = 914 / 1624
			
 
				+  var wCh = clientWidth / clientHeight
			
 
				+  var maxDiff = 0.04
			
 
				+  if (Math.abs(wCh - originwCh) > maxDiff) {
			
 
				+    return (clientHeight * originwCh) / 9.14
			
 
				+  }
			
 
				+
			
 
				+
			
 
				+	return clientWidth / 9.14;
			
 
				+}
			
--- a/src/web/templates/active/yearEndReport/index.html
+++ b/src/web/templates/active/yearEndReport/index.html
@@ -1,10 +1,721 @@
 
				 <!DOCTYPE html>
			
 
				-<html lang="en">
			
 
				+<html lang="zh-CN" style="font-size: 50px;">
			
 
				+
			
 
				 <head>
			
 
				-    <meta charset="UTF-8">
			
 
				-    <title>this is year report</title>
			
 
				+    <meta charset="utf-8">
			
 
				+    <meta name="keywords" content="剑鱼标讯">
			
 
				+    <meta name="description" content="剑鱼标讯">
			
 
				+    <meta name="author" content="剑鱼标讯">
			
 
				+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
			
 
				+    <meta name="viewport"
			
 
				+          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
			
 
				+    <meta name="x5-page-mode" content="app">
			
 
				+    <meta name="apple-mobile-web-app-capable" content="yes">
			
 
				+    <meta name="apple-mobile-web-app-status-bar-style" content="black">
			
 
				+    <meta name="format-detection" content="telephone=no">
			
 
				+    <meta name="referrer" content="no-referrer">
			
 
				+    <link rel="icon" href="/favicon.ico">
			
 
				+    <title>年度报告</title>
			
 
				+    <link rel="preload" as="style" href="https://cdn-common.jianyu360.com/cdn/lib/reset-css/5.0.1/reset.min.css"/>
			
 
				+    <link rel="preload" as="style" href="https://cdn-common.jianyu360.com/cdn/lib/swiper/5.4.2/swiper.min.css"/>
			
 
				+    <l  ink rel="stylesheet" href="https://cdn-common.jianyu360.com/cdn/lib/reset-css/5.0.1/reset.min.css"/>
			
 
				+    <link rel="stylesheet" href="https://cdn-common.jianyu360.com/cdn/lib/animate-css/4.1.1/animate.css"/>
			
 
				+    <link rel="stylesheet" href="https://cdn-common.jianyu360.com/cdn/lib/swiper/5.4.2/swiper.min.css"/>
			
 
				+    <link rel="stylesheet" href="{{Msg "seo" "cdn"}}/common-module/yearEndReport/css/music.css">
			
 
				+    <link rel="stylesheet" href="{{Msg "seo" "cdn"}}/common-module/yearEndReport/css/index.css">
			
 
				+    <script src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/js/rem.js"></script>
			
 
				 </head>
			
 
				+
			
 
				 <body>
			
 
				-年报
			
 
				+
			
 
				+<div class="jy-report" v-cloak>
			
 
				+    <!-- S--MUSIC -->
			
 
				+    <audio id="audio" controls loop src='https://www.jianyu360.cn/big-member/video/music.mp3' autoplay></audio>
			
 
				+    <div id="music-control-box">
			
 
				+        <div class="music-icon-box">
			
 
				+            <img class="icon-music-on" src='{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/music/music.png' />
			
 
				+            <img class="icon-music-off" src='{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/music/music-off.png' />
			
 
				+        </div>
			
 
				+    </div>
			
 
				+    <!-- E--MUSIC -->
			
 
				+    <!-- S--Toast -->
			
 
				+    <div class="jy-toast" style="z-index: 2003;" v-show="showToastText">
			
 
				+        <div class="jy-toast__text">${showToastText}</div>
			
 
				+    </div>
			
 
				+    <!-- E--Toast -->
			
 
				+    <!-- Swiper -->
			
 
				+    <div class="swiper-container" ref="mySwiper">
			
 
				+        <div class="swiper-wrapper">
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-1">
			
 
				+                        <div class="user-info-group">
			
 
				+                            <img animate-name="up" animate-delay="600" class="jy-user-img" :src="pageInfo.user_head" alt="">
			
 
				+                            <p animate-name="up" animate-delay="600" class="jy-user-name">Hi~<span>${pageInfo.user_name}</span></p>
			
 
				+                            <p animate-name="up" animate-delay="200" class="tip-info">
			
 
				+                                <span class="text-hello">欢迎来到你的...</span>
			
 
				+                                <span>2021剑鱼之旅</span>
			
 
				+                            </p>
			
 
				+                            <div class="read_pact" animate-name="up" animate-delay="800">
			
 
				+                                <input @change="changeReadPact" v-model="readPact" type="checkbox" id="read" name="read_pact" value="read_pact">
			
 
				+                                <label for="read">同意剑鱼统计我的使用数据，</label><a href="">查看授权协议</a>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                        <div animate-name="up" animate-delay="500" class="go-report">
			
 
				+                            <div class="go-button" @click="goStart">即刻启程</div>
			
 
				+                        </div>
			
 
				+                        <div class="add-layer-group">
			
 
				+                            <img class="meteor-left" src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P1/meteor.png">
			
 
				+                            <img class="meteor-mini" src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P1/meteor-mini.png">
			
 
				+                            <img class="meteor-bg" src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P1/bottom-bg.png">
			
 
				+                        </div>
			
 
				+                        <img animate-name="up" animate-delay="900" class="jy-logo" src="https://www.jianyu360.cn/images/pc/logo.png" alt="">
			
 
				+                        <div class="next-page"></div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+             <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-2">
			
 
				+                        <div class="meet">
			
 
				+                            <p animate-name="up" animate-delay="200" class="hello">醉纸鸢，你好呀！</p>
			
 
				+                            <p animate-name="up" animate-delay="400" style="margin-top: 0.32rem; margin-left: 1.54rem;">
			
 
				+                                <span class="text">还记得</span>
			
 
				+                                <span class="time">2019年3月27日</span>
			
 
				+                                <span class="text">吗？</span>
			
 
				+                            </p>
			
 
				+                            <div class="star-two">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P2/star-two.png" alt="">
			
 
				+                            </div>
			
 
				+                            <p animate-name="up" animate-delay="800" class="text-a" style="margin-top: 4.52rem;">很开心能遇见你</p>
			
 
				+                            <div class="fish-two">
			
 
				+                                <img class="swiper-lazy"  data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P2/fish-two.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="tail-two">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P2/tail-two.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                            <div>
			
 
				+                                <img class="swiper-lazy ball-two" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P2/ball-two.png" alt="">
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-3">
			
 
				+                        <div class="usage-days">
			
 
				+                            <div class="today">今天</div>
			
 
				+                            <div class="text">是我们一起同行的</div>
			
 
				+                            <div class="days">第732天</div>
			
 
				+                        </div>
			
 
				+                        <div class="star-three">
			
 
				+                            <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P3/star-three.png" alt="">
			
 
				+                        </div>
			
 
				+                        <div class="ball-three">
			
 
				+                            <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P3/ball-three.png" alt="">
			
 
				+                        </div>
			
 
				+                        <div class="yellow-three">
			
 
				+                            <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P3/yellow-three.png" alt="">
			
 
				+                        </div>
			
 
				+                        <p class="moqi">
			
 
				+                            <span class="mf">“免费看,不遮挡”的承诺</span>
			
 
				+                            <span class="mf" style="margin-top: 0.16rem;">是你我之间的永久的默契</span>
			
 
				+                        </p>
			
 
				+                        <div class="btn-next">
			
 
				+                            <div class="next-page"></div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-4">
			
 
				+                        <div class="year">
			
 
				+                            <div class="text-1">
			
 
				+                                <div class="jin">近一年</div>
			
 
				+                                <div class="day">
			
 
				+                                    <div class="ty">你登录了</div>
			
 
				+                                    <div class="days">279天</div>
			
 
				+                                    <div class="ty">剑鱼标讯</div>
			
 
				+                                </div>
			
 
				+                            </div>
			
 
				+                            <div class="sm-four">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P4/sm-four.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="fish-four">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P4/fish-four.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="big-four">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P4/big-four.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="text-2">
			
 
				+                                <div class="night">
			
 
				+                                    <div class="big-day">有138天</div>
			
 
				+                                    <div class="ty">的深夜</div>
			
 
				+                                </div>
			
 
				+                                <div class="ty" style="margin-left: 2.52rem;">仍在使用剑鱼标讯</div>
			
 
				+                            </div>
			
 
				+                            <div class="picture">
			
 
				+                                <img class="swiper-lazy" data-src="" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="text-bottom">
			
 
				+                                <div class="text-3">不是投标人爱熬夜</div>
			
 
				+                                <div class="text-3" style="margin-top: 0.16rem;">是黑夜需要投标人这颗璀璨的星</div>
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-5">
			
 
				+                        <div class="item">
			
 
				+                            <div class="this">近一年</div>
			
 
				+                            <div class="gongsi">郑州大学第一附属医院<br>LED显示屏系统</div>
			
 
				+                            <div class="guanzhu">是你最关注的项目</div>
			
 
				+                            <div class="yun-five">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P5/yun-five.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="ball-five">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P5/ball-five.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="fish-five">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P5/fish-five.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="aoyi-five"><img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P5/aoyi-five.png" alt=""></div>
			
 
				+                            <div class="text-bottom">
			
 
				+                                <p>无论结果如何，我知道</p>
			
 
				+                                <p style="margin-top: 0.16rem;">这些标讯对你来说一定有特别的意义</p>
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-6">
			
 
				+                        <div class="message">
			
 
				+                            <div class="year">近一年</div>
			
 
				+                            <div class="you">你一共浏览了</div>
			
 
				+                            <div class="num">73699条</div>
			
 
				+                            <div class="xiangmu">项目信息</div>
			
 
				+                            <div class="ball-six"><img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P6/ball-six.png" alt=""></div>
			
 
				+                            <div class="group-six"><img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P6/group-six.png" alt=""></div>
			
 
				+                            <div class="fish-six"><img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P6/fish-six.png" alt=""></div>
			
 
				+                            <div class="xd-six"><img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P6/xd-six.png" alt=""></div>
			
 
				+                            <div class="text-one">
			
 
				+                                <p>精准、及时的数据</p>
			
 
				+                                <p style="margin-top: 0.16rem;">都源于剑鱼悄悄的努力</p>
			
 
				+                            </div>
			
 
				+                            <div class="text-two">
			
 
				+                                <div class="box">
			
 
				+                                    <p class="p-one">招标信息库</p>
			
 
				+                                    <span class="s-one">9000万+</span>
			
 
				+                                    <p class="p-one">项目库</p>
			
 
				+                                    <span class="s-one">4800万+</span>
			
 
				+                                </div>
			
 
				+                                <div class="box">
			
 
				+                                    <p class="p-one">企业库</p>
			
 
				+                                    <span class="s-one">4500万+</span>
			
 
				+                                    <p class="p-one">采购单位库</p>
			
 
				+                                    <span class="s-one">200万+</span>
			
 
				+                                </div>
			
 
				+                            </div>
			
 
				+                            <div class="text-bottom">让你不遗漏任何商机</div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-7">
			
 
				+                        <div class="sum">
			
 
				+                            <div class="year">近一年</div>
			
 
				+                            <div class="you">你搜索了</div>
			
 
				+                            <div class="num">3654次</div>
			
 
				+                            <div class="xd-seven"><img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P7/xd-seven.png" alt=""></div>
			
 
				+                            <div class="text-bottom">求索力让你的成功触手可及</div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-8">
			
 
				+                        <div class="friend">
			
 
				+                            <div class="year">近一年</div>
			
 
				+                            <div class="num">765个</div>
			
 
				+                            <div class="you">企业成为你的新朋友</div>
			
 
				+                            <div class="ball-eight"><img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P8/ball-eight.png" alt=""></div>
			
 
				+                            <div class="xd-eight"><img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P8/xd-eight.png" alt=""></div>
			
 
				+                            <div class="text-bottom">
			
 
				+                                <div class="text">通过企业搜索、采购单位画像</div>
			
 
				+                                <div class="text">了解甲方、找到合作</div>
			
 
				+                                <div class="text">果断的执行力，让无数人为你痴迷</div>
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-9">
			
 
				+                        <div class="mouth">
			
 
				+                            <div class="year">
			
 
				+                                <p class="nian" style="display: contents">近一年，</p>
			
 
				+                                <span class="yue" style="color: #70EEFF;">7月</span>
			
 
				+                            </div>
			
 
				+                            <div class="you">是你最繁忙的时候</div>
			
 
				+                            <div><img class="swiper-lazy" data-src="" alt=""></div>
			
 
				+                            <div class="text-bottom">
			
 
				+                                <div class="text">或许奔波在投标路上</div>
			
 
				+                                <div class="text">或许驰骋在投标知识的海洋</div>
			
 
				+                                <div class="text">追梦的你，满怀热忱</div>
			
 
				+                            </div>
			
 
				+                            <div class="banner-yue">
			
 
				+                                <div class="banner-yue-one">7</div>
			
 
				+                                <div class="banner-yue-two">月</div>
			
 
				+                            </div>
			
 
				+                            <div class="ball-nine"><img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P9/ball-nine.png" alt=""></div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-10">
			
 
				+                        <div class="ten">
			
 
				+                            <div class="pao-ten">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P10/pao-ten.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="fish-ten">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P10/fish-ten.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="big-ten">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P10/big-ten.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="sm-ten">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P10/sm-ten.png" alt="">
			
 
				+                            </div>
			
 
				+                            <p class="year">近一年</p>
			
 
				+                            <div class="you">你关注的行业累计发布了</div>
			
 
				+                            <span class="num">3698条</span>
			
 
				+                            <div class="gonggao">项目公告</div>
			
 
				+                            <div class="text-bottom">
			
 
				+                                <div class="text">即使受到疫情的影响</div>
			
 
				+                                <div class="text">投标人依旧稳步向前</div>
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-11">
			
 
				+                        <div class="eleven">
			
 
				+                            <div class="ball-eleven">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P11/ball-eleven.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="fish-eleven">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P11/fish-eleven.png" alt="">
			
 
				+                            </div>
			
 
				+                            <p class="year">近一年</p>
			
 
				+                            <div class="you">慧眼识珠的你,体验了剑鱼</div>
			
 
				+                            <div class="gn">
			
 
				+                                <span class="num">17个</span>
			
 
				+                                <p class="new">新功能</p>
			
 
				+                            </div>
			
 
				+                            <div class="list">
			
 
				+                                <p>免费标讯搜索</p>
			
 
				+                                <p>超级订阅</p>
			
 
				+                                <p>大会员</p>
			
 
				+                                <p>数据导出</p>
			
 
				+                                <p>行业解决方案</p>
			
 
				+                                <p>......</p>
			
 
				+                            </div>
			
 
				+                            <div class="text-bottom">
			
 
				+                                <div class="text">从未枯竭的好奇心</div>
			
 
				+                                <div class="text">让你看到了更大的世界</div>
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-12">
			
 
				+                        <div class="twelve">
			
 
				+                            <div class="text">
			
 
				+                                <div class="sm-star-twelve">
			
 
				+                                    <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P12/sm-star-twelve.png" alt="">
			
 
				+                                </div>
			
 
				+                                <p class="text-1">无论好的坏的</p>
			
 
				+                                <div class="text-1" style="margin-top: 0.16rem;">跌宕且绮丽的2021已结束</div>
			
 
				+                                <div class="text-3">凛冬散尽，星河长明</div>
			
 
				+                                <div class="text-1" style="margin-top: 1.04rem;">为你生成2021年度角色报告</div>
			
 
				+                                <div class="btn">
			
 
				+                                    <div class="sc">生成报告</div>
			
 
				+                                </div>
			
 
				+                                <div class="xd-twelve">
			
 
				+                                    <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P12/xd-twelve.png" alt="">
			
 
				+                                </div>
			
 
				+                                <div class="big-star-twelve">
			
 
				+                                    <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P12/big-star-twelve.png" alt="">
			
 
				+                                </div>
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <!-- 新用户 -->
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-new-0">
			
 
				+                        <div class="new-zero">
			
 
				+                            <div class="text">
			
 
				+                                <div class="year">2021</div>
			
 
				+                                <div class="sm-zero"><img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P0/sm-zero.png" alt=""></div>
			
 
				+                                <div class="text-1">
			
 
				+                                    <p>遗憾没有和您相遇</p>
			
 
				+                                    <p>但所有的遗憾</p>
			
 
				+                                    <p>都是2022惊喜的铺垫</p>
			
 
				+                                </div>
			
 
				+                                <div class="text-2">
			
 
				+                                    <div>招免费看，不遮挡服务初心不改</div>
			
 
				+                                    <div>商机线索推荐、AI智能服务中标创新永不停歇</div>
			
 
				+                                </div>
			
 
				+                                <div class="fish-zero"><img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P0/fish-zero.png" alt=""></div>
			
 
				+                                <div class="xd-zero"><img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P0/xd-zero.png" alt=""></div>
			
 
				+                                <div class="year" style="margin-top: 3.56rem;">新的一年</div>
			
 
				+                                <div class="text-3">
			
 
				+                                    <div>期待能和你肩并肩</div>
			
 
				+                                    <div>走的更远</div>
			
 
				+                                </div>
			
 
				+                                <div class="btn">即刻体验</div>
			
 
				+                                <div class="big-zero"><img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P0/big-zero.png" alt=""></div>
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-5678-kong">
			
 
				+                        <div class="sum">
			
 
				+                            <div class="year">你可能是个慢热的人</div>
			
 
				+                            <div class="you">这一年</div>
			
 
				+                            <div class="num">还未有项目和企业成功引起你的关注</div>
			
 
				+                            <div class="text">不急，未来会有的</div>
			
 
				+                            <div class="xd-seven"><img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P7/xd-seven.png" alt=""></div>
			
 
				+                            <div class="text-bottom">点击试用一下，会有惊喜</div>
			
 
				+                            <div class="btn">试用一下</div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-10-kong">
			
 
				+                        <div class="ten">
			
 
				+                            <div class="pao-ten">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P10/pao-ten.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="fish-ten">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P10/fish-ten.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="big-ten">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P10/big-ten.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="sm-ten">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P10/sm-ten.png" alt="">
			
 
				+                            </div>
			
 
				+                            <p class="year">近一年</p>
			
 
				+                            <div class="you">你的忙碌都有了收获</div>
			
 
				+                            <div class="text-zg">
			
 
				+                                <div>通过及时的标讯信息</div>
			
 
				+                                <div style="margin-top: 0.24rem;">找合作、找甲方、找商机</div>
			
 
				+                            </div>
			
 
				+                            <div class="text-bottom">
			
 
				+                                <div class="text">即使受到疫情影响</div>
			
 
				+                                <div class="text">依旧稳步向前</div>
			
 
				+                            </div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+            <div class="swiper-slide">
			
 
				+                <div class="slide-inner">
			
 
				+                    <div class="report-page page-11-kong">
			
 
				+                        <div class="eleven">
			
 
				+                            <div class="ball-eleven">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P11/ball-eleven.png" alt="">
			
 
				+                            </div>
			
 
				+                            <div class="fish-eleven">
			
 
				+                                <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P11/fish-eleven.png" alt="">
			
 
				+                            </div>
			
 
				+                            <p class="year">近一年</p>
			
 
				+                            <div class="you">剑鱼产品不断迭代</div>
			
 
				+                            <div class="list">
			
 
				+                                <p>超级订阅V4.0</p>
			
 
				+                                <p>大会员V2.0</p>
			
 
				+                                <p>数据流量包</p>
			
 
				+                                <p>......</p>
			
 
				+                            </div>
			
 
				+                            <div class="text">期待您有更好的体验</div>
			
 
				+                            <div class="btn">试用一下</div>
			
 
				+                            <div class="btn-next">
			
 
				+                                <div class="next-page"></div>
			
 
				+                            </div>
			
 
				+                        </div>
			
 
				+                    </div>
			
 
				+                </div>
			
 
				+            </div>
			
 
				+        </div>
			
 
				+    </div>
			
 
				+</div>
			
 
				+
			
 
				+
			
 
				+<!--S-必定需要预加载的资源-->
			
 
				+<link rel="preload" as="script" href="https://cdn-common.jianyu360.com/cdn/lib/vue/2.6.11/vue.min.js"/>
			
 
				+<link rel="preload" as="script" href="https://cdn-common.jianyu360.com/cdn/lib/zepto/1.2.0/zepto.min.js"/>
			
 
				+<link rel="preload" as="script" href="https://cdn-common.jianyu360.com/cdn/lib/swiper/5.4.2/swiper.min.js"/>
			
 
				+<!--E-必定需要预加载的资源-->
			
 
				+<!--S-当前页面的资源-->
			
 
				+<script src="https://cdn-common.jianyu360.com/cdn/lib/swiper/5.4.2/swiper.min.js"></script>
			
 
				+<script src="https://cdn-common.jianyu360.com/cdn/lib/vue/2.6.11/vue.min.js"></script>
			
 
				+<script src="https://cdn-common.jianyu360.com/cdn/lib/jquery/3.6.0/jquery.min.js"></script>
			
 
				+
			
 
				+<!--S-提前需要预加载的资源-->
			
 
				+<link rel="prefetch" as="html" href="./result.html"/>
			
 
				+<link rel="prefetch" as="script" href="https://cdn-common.jianyu360.com/cdn/lib/html2canvas/1.1.2/dist/html2canvas.min.js"/>
			
 
				+<!--E-提前需要预加载的资源-->
			
 
				+<script>
			
 
				+
			
 
				+    function initSwiper() {
			
 
				+        var interleaveOffset = 0.5; //视差比值
			
 
				+
			
 
				+        function playAnOfIndex(index, type = true, delay = 0) {
			
 
				+            setTimeout(function () {
			
 
				+                var tempNode = $('.swiper-container .slide-inner').eq(index).find('*[animate-name]')
			
 
				+                $(tempNode).each(function () {
			
 
				+                    var anName = $(this).attr('animate-name')
			
 
				+                    var anDelay = $(this).attr('animate-delay') || '200'
			
 
				+                    if (type) {
			
 
				+                        $(this).addClass(anName)
			
 
				+                        $(this).css('animation-delay', anDelay + 'ms')
			
 
				+                    } else {
			
 
				+                        tempNode.removeClass(anName)
			
 
				+                    }
			
 
				+                })
			
 
				+            }, delay)
			
 
				+        }
			
 
				+
			
 
				+        var swiperOptions = {
			
 
				+            loop: false,
			
 
				+            speed: 1000,
			
 
				+            grabCursor: true,
			
 
				+            watchSlidesProgress: true,
			
 
				+            mousewheelControl: false,
			
 
				+            direction: 'vertical',
			
 
				+            mousewheel: true,
			
 
				+            //设置宽度为全屏
			
 
				+            width: window.innerWidth,
			
 
				+            height: window.innerHeight,
			
 
				+            allowSlideNext : false,
			
 
				+            lazy: {
			
 
				+                loadPrevNext: true,
			
 
				+            },
			
 
				+            on: {
			
 
				+                init: function () {
			
 
				+                    playAnOfIndex(0, true, 1000)
			
 
				+                },
			
 
				+                slideChangeTransitionStart: function () {
			
 
				+                    var index = this.activeIndex
			
 
				+                    playAnOfIndex(index, false)
			
 
				+                },
			
 
				+                slideChangeTransitionEnd: function () {
			
 
				+                    var index = this.activeIndex
			
 
				+                    playAnOfIndex(index)
			
 
				+                },
			
 
				+                slideChange: function () {
			
 
				+                    var index = this.activeIndex
			
 
				+                    playAnOfIndex(index)
			
 
				+                },
			
 
				+                progress: function () {
			
 
				+                    for (var i = 0; i < this.slides.length; i++) {
			
 
				+                        var slideProgress = this.slides[i].progress;
			
 
				+                        var innerOffset = this.width * interleaveOffset;
			
 
				+                        var innerTranslate = slideProgress * innerOffset;
			
 
				+                        this.slides[i].querySelector(".slide-inner").style.transform =
			
 
				+                            "translate3d(0," + innerTranslate + "px, 0)";
			
 
				+                    }
			
 
				+                },
			
 
				+                touchStart: function () {
			
 
				+                    for (var i = 0; i < this.slides.length; i++) {
			
 
				+                        this.slides[i].style.transition = "";
			
 
				+                    }
			
 
				+                },
			
 
				+                setTransition: function (speed) {
			
 
				+                    for (var i = 0; i < this.slides.length; i++) {
			
 
				+                        this.slides[i].style.transition = speed + "ms";
			
 
				+                        this.slides[i].querySelector(".slide-inner").style.transition =
			
 
				+                            speed + "ms";
			
 
				+                    }
			
 
				+                }
			
 
				+            }
			
 
				+        };
			
 
				+
			
 
				+        var swiper = new Swiper(this.$refs.mySwiper, swiperOptions);
			
 
				+        this.$swiper = swiper
			
 
				+    }
			
 
				+
			
 
				+    function initPlayMusic () {
			
 
				+        var isAutoPlayMusic = false
			
 
				+        var bgvid = document.getElementById("audio");
			
 
				+        var b_music = document.getElementById('music-control-box')
			
 
				+        var fullbox = document.querySelector('body');
			
 
				+
			
 
				+        fullbox.addEventListener('touchstart', function(){
			
 
				+            if (isAutoPlayMusic) {
			
 
				+                isAutoPlayMusic = false
			
 
				+                bgvid.play()
			
 
				+                b_music.classList.add('run-music')
			
 
				+            }
			
 
				+        }, false);
			
 
				+
			
 
				+        bgvid.addEventListener("playing", function(){
			
 
				+            b_music.style.display = 'block'
			
 
				+            b_music.classList.add('run-music')
			
 
				+        });
			
 
				+        bgvid.addEventListener("pause", function(){
			
 
				+            b_music.classList.remove('run-music')
			
 
				+        });
			
 
				+        b_music.addEventListener('click', function (e) {
			
 
				+            if (b_music.classList.contains('run-music')) {
			
 
				+                bgvid.pause()
			
 
				+                b_music.classList.remove('run-music')
			
 
				+            } else {
			
 
				+                bgvid.play()
			
 
				+                b_music.classList.add('run-music')
			
 
				+            }
			
 
				+        })
			
 
				+    }
			
 
				+
			
 
				+
			
 
				+    const pageInfo = {
			
 
				+        // 用户信息
			
 
				+        user_name: '醉纸鸢',
			
 
				+        user_head: 'https://www.jianyu360.cn/images/auto.png',
			
 
				+        share_link: 'https://www.jianyu360.cn/images/auto.png',
			
 
				+        // 是否新用户
			
 
				+        is_new: false,
			
 
				+        // 注册时间 秒
			
 
				+        registration_time: 1644249599,
			
 
				+        // 距离今天的天数
			
 
				+        total_days: 100,
			
 
				+        // 近一年登录天数
			
 
				+        login_days: 50,
			
 
				+        // 深夜登录天数
			
 
				+        active_days: -1,
			
 
				+        // 最关注的项目名称
			
 
				+        focus_project: '最关注的项目名称',
			
 
				+        // 浏览信息次数
			
 
				+        view_total: 1000,
			
 
				+        // 搜索次数
			
 
				+        search_total: 999,
			
 
				+        // 企业/项目关注数量
			
 
				+        follow_total: -1,
			
 
				+        // 繁忙月份
			
 
				+        active_month: 7,
			
 
				+        // 行业发布数据条数
			
 
				+        industry_total: 99,
			
 
				+        // 体验新功能列表
			
 
				+        exp_list: ['大会员', '超级订阅', '数据导出', '行业解决方案'],
			
 
				+        // 结果页type
			
 
				+        result: 1
			
 
				+    }
			
 
				+
			
 
				+    var vPage = new Vue({
			
 
				+        el: '.jy-report',
			
 
				+        delimiters: ['${', '}'],
			
 
				+        data: function () {
			
 
				+            return {
			
 
				+                pageInfo: pageInfo,
			
 
				+                showToastText: false,
			
 
				+                readPact: false
			
 
				+            }
			
 
				+        },
			
 
				+        created: function () {
			
 
				+
			
 
				+        },
			
 
				+        mounted: function () {
			
 
				+            initPlayMusic()
			
 
				+            initSwiper.bind(this)()
			
 
				+        },
			
 
				+        methods: {
			
 
				+            changeReadPact: function () {
			
 
				+                if (this.$swiper.activeIndex === 0 && this.readPact) {
			
 
				+                    return
			
 
				+                }
			
 
				+                this.$swiper.allowSlideNext = this.readPact
			
 
				+            },
			
 
				+            goStart: function () {
			
 
				+              if (!this.readPact) {
			
 
				+                  return this.showToast('请先阅读并同意授权协议')
			
 
				+              }
			
 
				+              this.$swiper.allowSlideNext = this.readPact
			
 
				+              this.$swiper.slideNext()
			
 
				+            },
			
 
				+            showToast: function (str, delay = 1500) {
			
 
				+                this.showToastText = str
			
 
				+                setTimeout(() => {
			
 
				+                    this.showToastText = false
			
 
				+                }, delay)
			
 
				+            }
			
 
				+        }
			
 
				+    })
			
 
				+
			
 
				+</script>
			
 
				 </body>
			
 
				-</html>
			
 
				+
			
 
				+</html>
			
--- a/src/web/templates/active/yearEndReport/result.html
+++ b/src/web/templates/active/yearEndReport/result.html
@@ -0,0 +1,397 @@
 
				+<!DOCTYPE html>
			
 
				+<html lang="zh-CN" style="font-size: 50px;">
			
 
				+
			
 
				+<head>
			
 
				+  <meta charset="utf-8">
			
 
				+  <meta name="keywords" content="剑鱼标讯">
			
 
				+  <meta name="description" content="剑鱼标讯">
			
 
				+  <meta name="author" content="剑鱼标讯">
			
 
				+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
			
 
				+  <meta name="viewport"
			
 
				+    content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
			
 
				+  <meta name="x5-page-mode" content="app">
			
 
				+  <meta name="apple-mobile-web-app-capable" content="yes">
			
 
				+  <meta name="apple-mobile-web-app-status-bar-style" content="black">
			
 
				+  <meta name="format-detection" content="telephone=no">
			
 
				+  <meta name="referrer" content="no-referrer">
			
 
				+  <link rel="icon" href="/favicon.ico">
			
 
				+  <title>年度报告</title>
			
 
				+  <link rel="preload" as="style" href="https://cdn-common.jianyu360.com/cdn/lib/reset-css/5.0.1/reset.min.css" />
			
 
				+  <link rel="stylesheet" href="https://cdn-common.jianyu360.com/cdn/lib/reset-css/5.0.1/reset.min.css" />
			
 
				+  <link rel="stylesheet" href="//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/index.css">
			
 
				+  <link rel="stylesheet" href="{{Msg "seo" "cdn"}}/common-module/yearEndReport/css/music.css">
			
 
				+  <link rel="stylesheet" href="{{Msg "seo" "cdn"}}/common-module/yearEndReport/css/result.css">
			
 
				+</head>
			
 
				+
			
 
				+<body>
			
 
				+  <div id="result" class="mask-report" v-cloak>
			
 
				+    <!-- S--MUSIC -->
			
 
				+    <audio id="audio" controls loop src='https://www.jianyu360.cn/big-member/video/music.mp3' autoplay></audio>
			
 
				+    <div id="music-control-box" v-if="!picImgStatus">
			
 
				+      <div class="music-icon-box">
			
 
				+        <img class="icon-music-on" src='{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/music/music.png' />
			
 
				+        <img class="icon-music-off" src='{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/music/music-off.png' />
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <!-- E--MUSIC -->
			
 
				+    <div class="jy-report result" ref="resultRefs">
			
 
				+    <!-- 结果1、2背景的装饰 -->
			
 
				+    <div class="ball" v-if="curRole._id == 1">
			
 
				+      <img src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/ball.png" alt="">
			
 
				+    </div>
			
 
				+    <div class="star" v-if="curRole._id == 2">
			
 
				+      <img src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/star.png" alt="">
			
 
				+    </div>
			
 
				+    <div class="r-content">
			
 
				+      <div class="info">
			
 
				+        <div class="user">
			
 
				+          <div class="head-img">
			
 
				+            <img src="https://cdn-ali.jianyu360.com/images/appext/fixed-sm.jpg" alt="">
			
 
				+          </div>
			
 
				+          <div class="nick-name">Wind</div>
			
 
				+        </div>
			
 
				+        <div class="role">
			
 
				+          <div class="role-placeholder">您的年度角色是</div>
			
 
				+          <div class="role-title">${curRole.title}</div>
			
 
				+          <div class="role-main">
			
 
				+            <p class="role-text">跨过遗憾 跨过不甘。2022年，你会</p>
			
 
				+            <div class="role-label">
			
 
				+              <img :src="curRole.label" alt="">
			
 
				+            </div>
			
 
				+          </div>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+      <!-- <div class="role-bg" :class="[{'role-bg-1': curRole._id == 1,'role-bg-2': curRole._id == 2, 'role-bg-other': curRole._id > 2}]">
			
 
				+        <img :src='curRole.bg' alt="">
			
 
				+      </div> -->
			
 
				+      <div class="role-bg role-bg-other">
			
 
				+        <img :src='curRole.bg' alt="">
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <!-- 按钮 -->
			
 
				+    <div class="r-btns" v-if="!picImgStatus" key="status">
			
 
				+      <button v-show="!isWeiXinBrowser" type="button" class="share-btn" @click.prevent="shareFn">去分享</button>
			
 
				+      <button type="button" class="create-btn" @click.prevent="createImgFn">生成海报</button>
			
 
				+    </div>
			
 
				+    <!-- 底部二维码 -->
			
 
				+    <div class="r-bottom" v-else key="status">
			
 
				+       <div class="jy-logo">
			
 
				+        <img src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/jy-logo.png" alt="">
			
 
				+       </div>
			
 
				+       <div class="jy-qcode">
			
 
				+         <div class="code-label">
			
 
				+          <p>扫一扫</p>
			
 
				+          <p style="line-height: .3rem;">看看你的年度角色</p>
			
 
				+         </div>
			
 
				+         <div class="code-img">
			
 
				+           <img src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/jy-qcode.png" alt="">
			
 
				+         </div>
			
 
				+       </div>
			
 
				+    </div>
			
 
				+    <van-action-sheet
			
 
				+      v-model="showAction"
			
 
				+      :actions="actions"
			
 
				+      cancel-text="取消"
			
 
				+      close-on-click-action
			
 
				+      @select="selectShare"
			
 
				+    ></van-action-sheet>
			
 
				+  </div>
			
 
				+</div>
			
 
				+  <!--S-必定需要预加载的资源-->
			
 
				+  <link rel="preload" as="script" href="https://cdn-common.jianyu360.com/cdn/lib/vue/2.6.11/vue.min.js" />
			
 
				+  <link rel="preload" as="script" href="https://cdn-common.jianyu360.com/cdn/lib/zepto/1.2.0/zepto.min.js" />
			
 
				+  <!--E-必定需要预加载的资源-->
			
 
				+  <!--S-当前页面的资源-->
			
 
				+  <script src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/js/rem.js"></script>
			
 
				+  <script src="https://cdn-common.jianyu360.com/cdn/lib/vue/2.6.11/vue.min.js"></script>
			
 
				+  <script src=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/vant.min.js></script>
			
 
				+  <script src="https://cdn-common.jianyu360.com/cdn/lib/zepto/1.2.0/zepto.min.js"></script>
			
 
				+  <script src="https://cdn-common.jianyu360.com/cdn/lib/html2canvas/1.1.2/dist/html2canvas.min.js"></script>
			
 
				+  <script src=//res2.wx.qq.com/open/js/jweixin-1.6.0.js></script>
			
 
				+  <script src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/js/common.js"></script>
			
 
				+  <!-- 使用html2canvas 生成图片dom层不能使用背景图 否则生成的图片会模糊 且无法修复 -->
			
 
				+  <script>
			
 
				+    function initPlayMusic () {
			
 
				+      var isAutoPlayMusic = false
			
 
				+      var bgvid = document.getElementById("audio");
			
 
				+      var b_music = document.getElementById('music-control-box')
			
 
				+      var fullbox = document.querySelector('body');
			
 
				+
			
 
				+      fullbox.addEventListener('touchstart', function(){
			
 
				+        if (isAutoPlayMusic) {
			
 
				+          isAutoPlayMusic = false
			
 
				+          bgvid.play()
			
 
				+          b_music.classList.add('run-music')
			
 
				+        }
			
 
				+      }, false);
			
 
				+
			
 
				+      bgvid.addEventListener("playing", function(){
			
 
				+        b_music.style.display = 'block'
			
 
				+        b_music.classList.add('run-music')
			
 
				+      });
			
 
				+      bgvid.addEventListener("pause", function(){
			
 
				+        b_music.classList.remove('run-music')
			
 
				+      });
			
 
				+      b_music.addEventListener('click', function (e) {
			
 
				+        if (b_music.classList.contains('run-music')) {
			
 
				+          bgvid.pause()
			
 
				+          b_music.classList.remove('run-music')
			
 
				+        } else {
			
 
				+          bgvid.play()
			
 
				+          b_music.classList.add('run-music')
			
 
				+        }
			
 
				+      })
			
 
				+    }
			
 
				+    var result = new Vue({
			
 
				+      el: '#result',
			
 
				+      delimiters: ['${', '}'],
			
 
				+      data: function() {
			
 
				+        return {
			
 
				+          resultList: [
			
 
				+            {_id: '1', title: '逢标必中的投标达人', label: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/label-1.png', bg: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/item-bg-1.png'},
			
 
				+            {_id: '2', title: '成功触手可及的追梦人', label: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/label-2.png', bg: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/item-bg-2.png'},
			
 
				+            {_id: '3', title: '怀抱热振元气满满的打工人', label: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/label-3.png', bg: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/item-bg-3.png'},
			
 
				+            {_id: '4', title: '日进斗金的大佬', label: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/label-4.png', bg: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/item-bg-4.png'},
			
 
				+            {_id: '5', title: '有钱任性的大BOSS', label: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/label-5.png', bg: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/item-bg-5.png'},
			
 
				+            {_id: '6', title: '开疆拓土的“顶梁柱”', label: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/label-6.png', bg: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/item-bg-6.png'},
			
 
				+            {_id: '7', title: '炉火纯青的盖章无影手', label: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/label-7.png', bg: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/item-bg-7.png'},
			
 
				+            {_id: '8', title: '有钱任性的大BOSS', label: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/label-8.png', bg: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/item-bg-5.png'},
			
 
				+            {_id: '9', title: '有钱任性的大BOSS', label: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/label-9.png', bg: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/item-bg-5.png'},
			
 
				+          ],
			
 
				+          curRole: {
			
 
				+            _id: '1',
			
 
				+            title: '逢标必中的投标达人',
			
 
				+            label: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/label-1.png',
			
 
				+            bg: '{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/result/item-bg-1.png'
			
 
				+          },
			
 
				+          picImgStatus: false,
			
 
				+          showAction: false,
			
 
				+          actions: [{ name: '微信' }, { name: '朋友圈' }],
			
 
				+          wxSDKSign: {
			
 
				+            debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印
			
 
				+            appId: '', // 必填，公众号的唯一标识
			
 
				+            timestamp: '', // 必填，生成签名的时间戳
			
 
				+            nonceStr: '', // 必填，生成签名的随机串
			
 
				+            signature: '',// 必填，签名
			
 
				+            jsApiList: [
			
 
				+                // 自定义“分享给朋友”及“分享到QQ”按钮的分享内容
			
 
				+                'updateAppMessageShareData',
			
 
				+                // 自定义“分享到朋友圈”及“分享到QQ空间”按钮的分享内容
			
 
				+                'updateTimelineShareData',
			
 
				+                // 获取“分享到腾讯微博”按钮点击状态及自定义分享内容接口
			
 
				+                'onMenuShareWeibo',
			
 
				+                // 关闭当前网页窗口接口
			
 
				+                'closeWindow',
			
 
				+                // 批量隐藏功能按钮接口
			
 
				+                // 'hideMenuItems',
			
 
				+                // 批量显示功能按钮接口
			
 
				+                // 'showMenuItems',
			
 
				+                // 隐藏所有非基础按钮接口
			
 
				+                // 'hideAllNonBaseMenuItem',
			
 
				+                // 显示所有功能按钮接口
			
 
				+                // 'showAllNonBaseMenuItem',
			
 
				+                // 调起微信扫一扫接口
			
 
				+                // 'scanQRCode'
			
 
				+            ],
			
 
				+            openTagList: ['wx-open-launch-app']
			
 
				+          },
			
 
				+          shareInfo: {
			
 
				+            title: '剑鱼标讯',
			
 
				+            desc: '我的剑鱼标讯2021」年度报告已经生成，请查收',
			
 
				+            link: location.href.split('?')[0],
			
 
				+            imgUrl: 'https://cdn-ali.jianyu360.com/images/appext/fixed-sm.jpg'
			
 
				+          },
			
 
				+        }
			
 
				+      },
			
 
				+      computed: {
			
 
				+        isWeiXinBrowser: function () {
			
 
				+          return utils.isWeiXinBrowser
			
 
				+        }
			
 
				+      },
			
 
				+      mounted() {
			
 
				+        initPlayMusic()
			
 
				+        // 微信端注册sdk
			
 
				+        if (utils.isWeiXinBrowser) {
			
 
				+          this.getWxSdkSign()
			
 
				+        }
			
 
				+        var list = this.resultList
			
 
				+        var _this = this
			
 
				+        list.forEach(function(item){
			
 
				+          if (item._id == utils.getParam('type')) {
			
 
				+            _this.curRole._id = item._id
			
 
				+            _this.curRole.title = item.title
			
 
				+            _this.curRole.label = item.label
			
 
				+            _this.curRole.bg = item.bg
			
 
				+          }
			
 
				+        })
			
 
				+      },
			
 
				+      methods: {
			
 
				+        showLoading: function (msg) {
			
 
				+          const loading = this.$toast.loading({
			
 
				+            duration: 0,
			
 
				+            forbidClick: true,
			
 
				+            message: msg || '图片生成中...',
			
 
				+          })
			
 
				+          return loading
			
 
				+        },
			
 
				+        changeStyle: function () {
			
 
				+          var rWidth = ($('.result').width())*2
			
 
				+          var rHeight = ($('.result').height())*2
			
 
				+          var padLeft = (rWidth - 750 ) / 2
			
 
				+          var padTop = (rHeight - 1448 ) / 2
			
 
				+          $('.mask-report').addClass('mask-report-active')
			
 
				+          $('.result').css({
			
 
				+            "padding": '0.64rem 0',
			
 
				+            "background-position": '-40px -40px',
			
 
				+            "background-size": "110% 110%"
			
 
				+
			
 
				+          })
			
 
				+          $('.r-content').css({
			
 
				+            "padding": '0 ' +  + padLeft/2 + 'px'
			
 
				+          })
			
 
				+          $('.role-bg').css({
			
 
				+            "width": "8.48rem",
			
 
				+            "left": "-41px"
			
 
				+          })
			
 
				+          $('.info').css({
			
 
				+            "width": "6.88rem"
			
 
				+          })
			
 
				+          $('.role-main').css({
			
 
				+            "padding": "0.48rem .54rem"
			
 
				+          })
			
 
				+          $(".role-text").css({
			
 
				+            "font-size": '0.36rem'
			
 
				+          })
			
 
				+          $('.r-bottom').css({
			
 
				+            padding: '0 0.3rem'
			
 
				+          })
			
 
				+        },
			
 
				+        // html2canvas方法
			
 
				+        covertToImage: function(container, options = {}) {
			
 
				+          // 设置放大倍数
			
 
				+          var scale = window.devicePixelRatio
			
 
				+          // 传入节点原始宽高
			
 
				+          var _width = container.offsetWidth
			
 
				+          var _height = container.offsetHeight
			
 
				+          let { width, height } = options
			
 
				+          width = width || _width
			
 
				+          height = height || _height
			
 
				+          var ops = {
			
 
				+            dpi: 300,
			
 
				+            scale,
			
 
				+            async: false,
			
 
				+            useCORS: true,
			
 
				+            // scrollX: 20,
			
 
				+            // scrollY: 20,
			
 
				+            allowTaint: false,
			
 
				+            backgroundColor: null, // 避免图片有白色边框
			
 
				+            ...options
			
 
				+          };
			
 
				+          return html2canvas(container, ops).then(function(canvas) {
			
 
				+            // 返回图片的二进制数据
			
 
				+            var url = canvas.toDataURL("image/png");
			
 
				+            return url
			
 
				+          })
			
 
				+        },
			
 
				+        // app端微信、朋友圈分享方法
			
 
				+        selectShare: function(e) {
			
 
				+          var shareTitle = '我的剑鱼标讯2021年度报告已经生成，请查收'
			
 
				+          var content = ''
			
 
				+          var link = window.location.href
			
 
				+          if (e.name == '微信') {
			
 
				+            try {
			
 
				+              JyObj.share(1,shareTitle,content,link);
			
 
				+            } catch (error) {}
			
 
				+          } else if (e.name == '朋友圈') {
			
 
				+            try {
			
 
				+              JyObj.share(3,shareTitle,content,link);
			
 
				+            } catch (error) {}
			
 
				+          }
			
 
				+        },
			
 
				+        // 取用户appid、签名等
			
 
				+        getWxSdkSign: function() {
			
 
				+          var _this = this
			
 
				+          $.ajax({
			
 
				+            url: '/jypay/wx/getwxSdkSign',
			
 
				+            type: 'POST',
			
 
				+            data: {
			
 
				+              url: location.href.split('#')[0]
			
 
				+            },
			
 
				+            success: function (res) {
			
 
				+              if (res && res.wxsdk && $.isArray(res.wxsdk)) {
			
 
				+                _this.wxSDKSign.appId = res.wxsdk[0]
			
 
				+                _this.wxSDKSign.timestamp = res.wxsdk[1]
			
 
				+                _this.wxSDKSign.nonceStr = res.wxsdk[2]
			
 
				+                _this.wxSDKSign.signature = res.wxsdk[3]
			
 
				+                _this.registerWxSDK()
			
 
				+              }
			
 
				+            },
			
 
				+            complete: function () {},
			
 
				+            error: function () {}
			
 
				+          })
			
 
				+        },
			
 
				+        // 注册微信sdk方法
			
 
				+        registerWxSDK: function () {
			
 
				+          var _this = this
			
 
				+          var extInfo = {
			
 
				+            url: 'jianyu360.com'
			
 
				+          }
			
 
				+          // 微信sdk注册
			
 
				+          wx.config(this.wxSDKSign)
			
 
				+          wx.error(function(err){
			
 
				+            console.log(err);
			
 
				+          })
			
 
				+          wx.ready(function (res) {
			
 
				+            // 自定义“分享给朋友”及“分享到QQ”按钮的分享内容
			
 
				+            wx.updateAppMessageShareData(_this.shareInfo)
			
 
				+            // 自定义“分享到朋友圈”及“分享到QQ空间”按钮的分享内容
			
 
				+            wx.updateTimelineShareData(_this.shareInfo)
			
 
				+            // onMenuShareWeibo
			
 
				+            wx.onMenuShareWeibo(_this.shareInfo)
			
 
				+          })
			
 
				+        },
			
 
				+        // 点击去分享
			
 
				+        shareFn: function () {
			
 
				+          if (utils.isWeiXinBrowser) {
			
 
				+            // 微信端使用自带分享
			
 
				+          } else {
			
 
				+            // app 使用客户端方法分享
			
 
				+            this.showAction = true
			
 
				+          }
			
 
				+        },
			
 
				+        // 点击生成海报
			
 
				+        createImgFn: function () {
			
 
				+          var loading = this.showLoading()
			
 
				+          $(".canvas-img").remove()
			
 
				+          this.picImgStatus = true
			
 
				+          if (this.picImgStatus) {
			
 
				+            var _this = this
			
 
				+            _this.changeStyle() // 生成图片前 先改变页面样式
			
 
				+            setTimeout(function() {
			
 
				+              var data = _this.covertToImage(_this.$refs.resultRefs)
			
 
				+              data.then(function(url) {
			
 
				+                loading.clear()
			
 
				+                $("body").append('<div class="canvas"><img class="canvas-img" src='+ url + '></div>')
			
 
				+                if (utils.isWeiXinBrowser) {
			
 
				+                  $("body").append('<img class="canvas-img" src='+ url + '>')
			
 
				+                } else {
			
 
				+                  // 调用客户端保存图片方法
			
 
				+                  try {
			
 
				+                    window.JyObj.savePic(url)
			
 
				+                  } catch (err) {
			
 
				+                    console.log(err);
			
 
				+                  }
			
 
				+                }
			
 
				+              }).catch(function(err) {
			
 
				+                console.log(err);
			
 
				+                _this.$toast('图片生成失败')
			
 
				+              })
			
 
				+            }, 500)
			
 
				+          }
			
 
				+        }
			
 
				+      }
			
 
				+    })
			
 
				+  </script>
			
 
				+</body>
			
 
				+
			
 
				+</html>