Browse Source

feat: 首页优化

zhangyuhan 3 years ago
parent
commit
b715fc5e61

+ 96 - 90
src/jfw/modules/app/src/web/templates/active/yearEndReport/index.html

@@ -57,7 +57,7 @@
                                 <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">
+                                <input @change="changeReadPact" v-model="readPact" type="checkbox" autocomplete="off" id="read">
                                 <label for="read">同意剑鱼统计我的使用数据,</label><a href="/jyapp/free/staticPage/privacy_rules.html">查看授权协议</a>
                             </div>
                         </div>
@@ -81,7 +81,7 @@
                             <p animate-name="up" animate-delay="200" class="hello">${pageInfo.user_name},你好呀!</p>
                             <p animate-name="up" animate-delay="400" style="margin-top: 0.32rem; margin-left: 1.54rem;">
                                 <span class="text">还记得</span>
-                                <span class="time">${pageInfo.registration_time}</span>
+                                <span class="time">${pageInfo.registration_time | dateFormat}</span>
                                 <span class="text">吗?</span>
                             </p>
                             <div class="star-two">
@@ -108,9 +108,9 @@
                 <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">第${pageInfo.total_days}天</div>
+                            <div class="today" animate-name="up" animate-delay="200">今天</div>
+                            <div class="text" animate-name="up" animate-delay="400">是我们一起同行的</div>
+                            <div class="days" animate-name="up" animate-delay="600">第${pageInfo.total_days}天</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="">
@@ -121,7 +121,7 @@
                         <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">
+                        <p class="moqi" animate-name="up" animate-delay="800" >
                             <span class="mf">“免费看,不遮挡”的承诺</span>
                             <span class="mf" style="margin-top: 0.16rem;">是你我之间的永久的默契</span>
                         </p>
@@ -136,11 +136,11 @@
                     <div class="report-page page-4">
                         <div class="year">
                             <div class="text-1">
-                                <div class="jin">近一年</div>
+                                <div class="jin" animate-name="up" animate-delay="200" >近一年</div>
                                 <div class="day">
-                                    <div class="ty">你登录了</div>
-                                    <div class="days">${pageInfo.login_days}天</div>
-                                    <div class="ty">剑鱼标讯</div>
+                                    <div class="ty" animate-name="up" animate-delay="400" >你登录了</div>
+                                    <div class="days" animate-name="up" animate-delay="600" >${pageInfo.login_days}天</div>
+                                    <div class="ty" animate-name="up" animate-delay="700" >剑鱼标讯</div>
                                 </div>
                             </div>
                             <div class="sm-four">
@@ -154,17 +154,17 @@
                             </div>
                             <div class="text-2">
                                 <div class="night">
-                                    <div class="big-day">有${pageInfo.active_days}天</div>
-                                    <div class="ty">的深夜</div>
+                                    <div class="big-day" animate-name="up" animate-delay="800" >有${pageInfo.active_days}天</div>
+                                    <div class="ty" animate-name="up" animate-delay="900" >的深夜</div>
                                 </div>
-                                <div class="ty" style="margin-left: 2.52rem;">仍在使用剑鱼标讯</div>
+                                <div class="ty" animate-name="up" animate-delay="1000"  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 class="text-3" animate-name="up" animate-delay="1200" >不是投标人爱熬夜</div>
+                                <div class="text-3" animate-name="up" animate-delay="1400" style="margin-top: 0.16rem;">是黑夜需要投标人这颗璀璨的星</div>
                             </div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
@@ -177,9 +177,9 @@
                 <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="this" animate-name="up" animate-delay="200" >近一年</div>
+                            <div class="gongsi" animate-name="up" animate-delay="400" >郑州大学第一附属医院<br>LED显示屏系统</div>
+                            <div class="guanzhu" animate-name="up" animate-delay="600" >是你最关注的项目</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>
@@ -191,8 +191,8 @@
                             </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>
+                                <p animate-name="up" animate-delay="800" >无论结果如何,我知道</p>
+                                <p animate-name="up" animate-delay="1000"  style="margin-top: 0.16rem;">这些标讯对你来说一定有特别的意义</p>
                             </div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
@@ -205,33 +205,33 @@
                 <div class="slide-inner">
                     <div class="report-page page-6">
                         <div class="message">
-                            <div class="year">近一年</div>
-                            <div class="you">你一共浏览了</div>
-                            <div class="num">${pageInfo.view_total}条</div>
-                            <div class="xiangmu">项目信息</div>
+                            <div class="year" animate-name="up" animate-delay="200" >近一年</div>
+                            <div class="you" animate-name="up" animate-delay="400" >你一共浏览了</div>
+                            <div class="num" animate-name="up" animate-delay="600" >${pageInfo.view_total}条</div>
+                            <div class="xiangmu" animate-name="up" animate-delay="700" >项目信息</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>
+                                <p animate-name="up" animate-delay="800" >精准、及时的数据</p>
+                                <p animate-name="up" animate-delay="1000"  style="margin-top: 0.16rem;">都源于剑鱼悄悄的努力</p>
                             </div>
                             <div class="text-two">
-                                <div class="box">
+                                <div class="box" animate-name="up" animate-delay="1100" >
                                     <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">
+                                <div class="box" animate-name="up" animate-delay="1200" >
                                     <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="text-bottom" animate-name="up" animate-delay="1400" >让你不遗漏任何商机</div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
                             </div>
@@ -243,11 +243,11 @@
                 <div class="slide-inner">
                     <div class="report-page page-7">
                         <div class="sum">
-                            <div class="year">近一年</div>
-                            <div class="you">你搜索了</div>
-                            <div class="num">${pageInfo.search_total}次</div>
+                            <div class="year" animate-name="up" animate-delay="200" >近一年</div>
+                            <div class="you" animate-name="up" animate-delay="400" >你搜索了</div>
+                            <div class="num" animate-name="up" animate-delay="600" >${pageInfo.search_total}次</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="text-bottom" animate-name="up" animate-delay="800" >求索力让你的成功触手可及</div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
                             </div>
@@ -259,15 +259,15 @@
                 <div class="slide-inner">
                     <div class="report-page page-8">
                         <div class="friend">
-                            <div class="year">近一年</div>
-                            <div class="num">${pageInfo.follow_total}个</div>
-                            <div class="you">企业成为你的新朋友</div>
+                            <div class="year" animate-name="up" animate-delay="200" >近一年</div>
+                            <div class="num" animate-name="up" animate-delay="400" >${pageInfo.follow_total}个</div>
+                            <div class="you" animate-name="up" animate-delay="600" >企业成为你的新朋友</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 class="text" animate-name="up" animate-delay="700" >通过企业搜索、采购单位画像</div>
+                                <div class="text" animate-name="up" animate-delay="800" >了解甲方、找到合作</div>
+                                <div class="text" animate-name="up" animate-delay="900" >果断的执行力,让无数人为你痴迷</div>
                             </div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
@@ -281,17 +281,17 @@
                     <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;">${pageInfo.active_month}月</span>
+                                <p class="nian" style="display: contents" animate-name="up" animate-delay="200" >近一年,</p>
+                                <div class="yue" style="color: #70EEFF;" animate-name="up" animate-delay="400" >${pageInfo.active_month}月</div>
                             </div>
-                            <div class="you">是你最繁忙的时候</div>
+                            <div class="you" animate-name="up" animate-delay="600" >是你最繁忙的时候</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 class="text" animate-name="up" animate-delay="800" >或许奔波在投标路上</div>
+                                <div class="text" animate-name="up" animate-delay="900" >或许驰骋在投标知识的海洋</div>
+                                <div class="text" animate-name="up" animate-delay="1000" >追梦的你,满怀热忱</div>
                             </div>
-                            <div class="banner-yue">
+                            <div class="banner-yue" animate-name="up" animate-delay="700" >
                                 <div class="banner-yue-one">${pageInfo.active_month}</div>
                                 <div class="banner-yue-two">月</div>
                             </div>
@@ -319,13 +319,13 @@
                             <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">${pageInfo.industry_total}条</span>
-                            <div class="gonggao">项目公告</div>
+                            <p class="year" animate-name="up" animate-delay="200" >近一年</p>
+                            <div class="you" animate-name="up" animate-delay="400" >你关注的行业累计发布了</div>
+                            <span class="num" animate-name="up" animate-delay="600" >${pageInfo.industry_total}条</span>
+                            <div class="gonggao" animate-name="up" animate-delay="800" >项目公告</div>
                             <div class="text-bottom">
-                                <div class="text">即使受到疫情的影响</div>
-                                <div class="text">投标人依旧稳步向前</div>
+                                <div class="text" animate-name="up" animate-delay="1000" >即使受到疫情的影响</div>
+                                <div class="text" animate-name="up" animate-delay="1200" >投标人依旧稳步向前</div>
                             </div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
@@ -344,13 +344,13 @@
                             <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">
+                            <p class="year" animate-name="up" animate-delay="200" >近一年</p>
+                            <div class="you" animate-name="up" animate-delay="400" >慧眼识珠的你,体验了剑鱼</div>
+                            <div class="gn" animate-name="up" animate-delay="600" >
                                 <span class="num">17个</span>
                                 <p class="new">新功能</p>
                             </div>
-                            <div class="list">
+                            <div class="list" animate-name="up" animate-delay="800" >
                                 <p>免费标讯搜索</p>
                                 <p>超级订阅</p>
                                 <p>大会员</p>
@@ -359,8 +359,8 @@
                                 <p>......</p>
                             </div>
                             <div class="text-bottom">
-                                <div class="text">从未枯竭的好奇心</div>
-                                <div class="text">让你看到了更大的世界</div>
+                                <div class="text" animate-name="up" animate-delay="1000" >从未枯竭的好奇心</div>
+                                <div class="text" animate-name="up" animate-delay="1200" >让你看到了更大的世界</div>
                             </div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
@@ -377,11 +377,11 @@
                                 <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 animate-name="up" animate-delay="500" class="btn">
+                                <p animate-name="up" animate-delay="200"  class="text-1">无论好的坏的</p>
+                                <div animate-name="up" animate-delay="300" class="text-1" style="margin-top: 0.16rem;">跌宕且绮丽的2021已结束</div>
+                                <div animate-name="up" animate-delay="400" class="text-3">凛冬散尽,星河长明</div>
+                                <div animate-name="up" animate-delay="500" class="text-1" style="margin-top: 1.04rem;">为你生成2021年度角色报告</div>
+                                <div animate-name="up" animate-delay="800" class="btn">
                                     <div class="go-button" @click="goResult">生成报告</div>
                                 </div>
                                 <div class="xd-twelve">
@@ -404,25 +404,27 @@
                     <div class="report-page page-new-0">
                         <div class="new-zero">
                             <div class="text">
-                                <div class="year">2021</div>
+                                <div class="year" animate-name="up" animate-delay="200" >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>
+                                    <p animate-name="up" animate-delay="300" >遗憾没有和您相遇</p>
+                                    <p animate-name="up" animate-delay="400" >但所有的遗憾</p>
+                                    <p animate-name="up" animate-delay="500" >都是2022惊喜的铺垫</p>
                                 </div>
                                 <div class="text-2">
-                                    <div>招免费看,不遮挡服务初心不改</div>
-                                    <div>商机线索推荐、AI智能服务中标创新永不停歇</div>
+                                    <div animate-name="up" animate-delay="700" >招免费看,不遮挡服务初心不改</div>
+                                    <div animate-name="up" animate-delay="800" >商机线索推荐、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="year" style="margin-top: 3.56rem;" animate-name="up" animate-delay="200" >新的一年</div>
                                 <div class="text-3">
-                                    <div>期待能和你肩并肩</div>
-                                    <div>走的更远</div>
+                                    <div animate-name="up" animate-delay="1000" >期待能和你肩并肩</div>
+                                    <div animate-name="up" animate-delay="1200" >走的更远</div>
+                                </div>
+                                <div animate-name="up" animate-delay="1300" class="btn">
+                                    <div class="go-button" @click="goResult">即刻体验</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">
@@ -436,13 +438,15 @@
                 <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="year" animate-name="up" animate-delay="200" >你可能是个慢热的人</div>
+                            <div class="you" animate-name="up" animate-delay="400" >这一年</div>
+                            <div class="num" animate-name="up" animate-delay="600" >还未有项目和企业成功引起你的关注</div>
+                            <div class="text" animate-name="up" animate-delay="800" >不急,未来会有的</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="text-bottom" animate-name="up" animate-delay="900" >点击试用一下,会有惊喜</div>
+                            <div animate-name="up" animate-delay="1100" class="btn">
+                                <div class="go-button" @click="goResult">试用一下</div>
+                            </div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
                             </div>
@@ -466,15 +470,15 @@
                             <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>
+                            <p class="year" animate-name="up" animate-delay="200" >近一年</p>
+                            <div class="you" animate-name="up" animate-delay="400" >你的忙碌都有了收获</div>
                             <div class="text-zg">
-                                <div>通过及时的标讯信息</div>
-                                <div style="margin-top: 0.24rem;">找合作、找甲方、找商机</div>
+                                <div animate-name="up" animate-delay="600" >通过及时的标讯信息</div>
+                                <div animate-name="up" animate-delay="800"  style="margin-top: 0.24rem;">找合作、找甲方、找商机</div>
                             </div>
                             <div class="text-bottom">
-                                <div class="text">即使受到疫情影响</div>
-                                <div class="text">依旧稳步向前</div>
+                                <div class="text" animate-name="up" animate-delay="1000" >即使受到疫情影响</div>
+                                <div class="text" animate-name="up" animate-delay="1200" >依旧稳步向前</div>
                             </div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
@@ -493,16 +497,18 @@
                             <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 class="year" animate-name="up" animate-delay="200" >近一年</p>
+                            <div class="you" animate-name="up" animate-delay="400" >剑鱼产品不断迭代</div>
+                            <div class="list" animate-name="up" animate-delay="600" >
                                 <p>超级订阅V4.0</p>
                                 <p>大会员V2.0</p>
                                 <p>数据流量包</p>
                                 <p>......</p>
                             </div>
-                            <div class="text">期待您有更好的体验</div>
-                            <div class="btn">试用一下</div>
+                            <div class="text" animate-name="up" animate-delay="800" >期待您有更好的体验</div>
+                            <div animate-name="up" animate-delay="1100" class="btn">
+                                <div class="go-button" @click="goResult">试用一下</div>
+                            </div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
                             </div>

+ 73 - 77
src/web/staticres/common-module/yearEndReport/css/index.css

@@ -365,7 +365,7 @@ body {
 }
 .page-2 .hello{
 font-size: 0.48rem;
-font-family: PingFang SC-Bold, PingFang SC;
+
 font-weight: bold;
 color: #FFFFFF;
 line-height: 0.56rem;
@@ -374,7 +374,7 @@ 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;
@@ -382,7 +382,7 @@ margin-left: 1.54rem;
 }
 .page-2 .text-a{
   font-size: 0.28rem;
-  font-family: PingFang SC-Regular, PingFang SC;
+
   font-weight: 400;
   color: #FFFFFF;
   line-height: 0.36rem;
@@ -391,7 +391,7 @@ 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;
@@ -456,7 +456,7 @@ margin-left: 1.54rem;
 }
 .page-3 .today{
 font-size: 0.48rem;
-font-family: PingFang SC-Bold, PingFang SC;
+
 font-weight: bold;
 color: #FFFFFF;
 line-height: 0.56rem;
@@ -467,7 +467,7 @@ left: 1.5rem;
 }
 .page-3 .text{
   font-size: .32rem;
-  font-family: PingFang SC-Regular, PingFang SC;
+
   font-weight: 400;
   color: #FFFFFF;
   line-height: .36rem;
@@ -478,7 +478,7 @@ left: 1.5rem;
 }
 .page-3 .days{
   font-size: .48rem;
-  font-family: PingFang SC-Bold, PingFang SC;
+
   font-weight: bold;
   color: #70EEFF;
   line-height: .56rem;
@@ -531,7 +531,7 @@ left: 1.5rem;
 }
 .page-3 .mf{
   font-size: .28rem;
-  font-family: PingFang SC-Regular, PingFang SC;
+
   font-weight: 400;
   color: #FFFFFF;
   line-height: .36rem;
@@ -561,7 +561,7 @@ left: 1.5rem;
 }
 .page-4 .jin{
 font-size: 0.48rem;
-font-family: PingFang SC-Bold, PingFang SC;
+
 font-weight: bold;
 color: #FFFFFF;
 line-height: 0.56rem;
@@ -573,7 +573,7 @@ margin-bottom: 0.16rem;
 }
 .page-4 .ty{
 font-size: 0.32rem;
-font-family: PingFang SC-Regular, PingFang SC;
+
 font-weight: 400;
 color: #FFFFFF;
 line-height: 0.36rem;
@@ -581,7 +581,7 @@ 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;
@@ -598,7 +598,7 @@ letter-spacing: 4px;
 }
 .page-4 .big-day{
 font-size: 0.48rem;
-font-family: PingFang SC-Bold, PingFang SC;
+
 font-weight: bold;
 color: #70EEFF;
 line-height: 0.56rem;
@@ -612,7 +612,7 @@ letter-spacing: 7px;
 }
 .page-4 .text-3{
 font-size: 0.28rem;
-font-family: PingFang SC-Regular, PingFang SC;
+
 font-weight: 400;
 color: #FFFFFF;
 line-height: 0.36rem;
@@ -662,7 +662,7 @@ letter-spacing: 4px;
 }
 .page-5 .this{
 font-size: 0.48rem;
-font-family: PingFang SC-Bold, PingFang SC;
+
 font-weight: bold;
 color: #FFFFFF;
 line-height: 0.56rem;
@@ -671,7 +671,7 @@ 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;
@@ -681,7 +681,7 @@ 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;
@@ -696,7 +696,7 @@ margin-left: 1.54rem;
 }
 .page-5  p{
 font-size: 0.28rem;
-font-family: PingFang SC-Regular, PingFang SC;
+
 font-weight: 400;
 color: #FFFFFF;
 line-height: 0.36rem;
@@ -755,7 +755,7 @@ letter-spacing: 4px;
 }
 .page-6 .year{
 font-size: 0.48rem;
-font-family: PingFang SC-Bold, PingFang SC;
+
 font-weight: bold;
 color: #FFFFFF;
 line-height: 0.56rem;
@@ -764,7 +764,7 @@ 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;
@@ -774,7 +774,7 @@ 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;
@@ -783,7 +783,7 @@ 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;
@@ -793,7 +793,7 @@ 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;
@@ -827,7 +827,7 @@ left: 2.8rem;
 }
 .page-6 .p-one{
 font-size: 0.24rem;
-font-family: PingFang SC-Regular, PingFang SC;
+
 font-weight: 400;
 color: #FFFFFF;
 line-height: 0.28rem;
@@ -835,7 +835,7 @@ 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;
@@ -843,7 +843,7 @@ 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;
@@ -908,7 +908,7 @@ position: absolute;
 }
 .page-7 .year{
 font-size: 0.48rem;
-font-family: PingFang SC-Bold, PingFang SC;
+
 font-weight: bold;
 color: #FFFFFF;
 line-height: 0.56rem;
@@ -917,7 +917,7 @@ 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;
@@ -927,7 +927,7 @@ 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;
@@ -936,7 +936,7 @@ 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;
@@ -969,7 +969,7 @@ position: absolute;
 }
 .page-8 .year{
   font-size: 0.48rem;
-  font-family: PingFang SC-Bold, PingFang SC;
+
   font-weight: bold;
   color: #FFFFFF;
   line-height: 0.56rem;
@@ -978,7 +978,7 @@ position: absolute;
   }
 .page-8 .num{
 font-size: 0.48rem;
-font-family: PingFang SC-Bold, PingFang SC;
+
 font-weight: bold;
 color: #70EEFF;
 line-height: 0.56rem;
@@ -988,7 +988,7 @@ 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;
@@ -1004,7 +1004,7 @@ margin-top: 0.16rem;
 }
 .page-8 .text{
 font-size: 0.28rem;
-font-family: PingFang SC-Regular, PingFang SC;
+
 font-weight: 400;
 color: #FFFFFF;
 line-height: 0.52rem;
@@ -1046,7 +1046,7 @@ letter-spacing: 4px;
 .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;
@@ -1055,7 +1055,7 @@ 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;
@@ -1071,7 +1071,7 @@ margin-top: 0.32rem;
 }
 .page-9 .text{
   font-size: 0.28rem;
-  font-family: PingFang SC-Regular, PingFang SC;
+
   font-weight: 400;
   color: #FFFFFF;
   line-height: 0.52rem;
@@ -1092,7 +1092,7 @@ margin-top: 0.32rem;
 }
 .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;
@@ -1100,7 +1100,7 @@ margin-top: 0.32rem;
 }
 .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;
@@ -1128,7 +1128,7 @@ margin-top: 0.32rem;
 }
 .page-10 .year{
 font-size: 0.48rem;
-font-family: PingFang SC-Bold, PingFang SC;
+
 font-weight: bold;
 color: #FFFFFF;
 line-height: 0.56rem;
@@ -1137,7 +1137,7 @@ 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;
@@ -1147,7 +1147,7 @@ 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;
@@ -1156,7 +1156,7 @@ 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;
@@ -1172,7 +1172,7 @@ margin-left: 4.52rem;
 }
 .page-10 .text{
 font-size: 0.28rem;
-font-family: PingFang SC-Regular, PingFang SC;
+
 font-weight: 400;
 color: #FFFFFF;
 line-height: 0.36rem;
@@ -1234,7 +1234,7 @@ letter-spacing: 4px;
 }
 .page-11 .year{
   font-size: 0.48rem;
-  font-family: PingFang SC-Bold, PingFang SC;
+
   font-weight: bold;
   color: #FFFFFF;
   line-height: 0.56rem;
@@ -1243,7 +1243,7 @@ letter-spacing: 4px;
 }
 .page-11 .new{
   font-size: 0.32rem;
-  font-family: PingFang SC-Regular, PingFang SC;
+
   font-weight: 400;
   color: #FFFFFF;
   line-height: 0.36rem;
@@ -1251,7 +1251,7 @@ 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;
@@ -1267,7 +1267,7 @@ letter-spacing: 4px;
 }
 .page-11 .num{
 font-size: 0.48rem;
-font-family: PingFang SC-Bold, PingFang SC;
+
 font-weight: bold;
 color: #70EEFF;
 line-height: 0.56rem;
@@ -1282,7 +1282,7 @@ letter-spacing: 7px;
 }
 .page-11 .list p{
   font-size: 0.28rem;
-  font-family: PingFang SC-Regular, PingFang SC;
+
   font-weight: 400;
   color: #FFFFFF;
   line-height: 0.52rem;
@@ -1297,7 +1297,7 @@ letter-spacing: 7px;
 }
 .page-11 .text{
 font-size: 0.28rem;
-font-family: PingFang SC-Regular, PingFang SC;
+
 font-weight: 400;
 color: #FFFFFF;
 line-height: 0.52rem;
@@ -1343,7 +1343,7 @@ letter-spacing: 4px;
 }
 .page-12 .text-1{
 font-size: 0.28rem;
-font-family: PingFang SC-Regular, PingFang SC;
+
 font-weight: 400;
 color: #FFFFFF;
 line-height: 0.36rem;
@@ -1351,7 +1351,7 @@ 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;
@@ -1421,7 +1421,7 @@ margin-top: 0.43rem;
 .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;
@@ -1436,7 +1436,7 @@ margin-top: 0.43rem;
 }
 .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;
@@ -1455,7 +1455,7 @@ margin: 0;
 }
 .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;
@@ -1467,7 +1467,7 @@ margin: 0;
 }
 .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;
@@ -1476,10 +1476,8 @@ margin: 0;
 .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;
@@ -1544,7 +1542,7 @@ margin: 0;
 }
 .page-5678-kong .year{
   font-size: 0.32rem;
-  font-family: PingFang SC-Regular, PingFang SC;
+
   font-weight: 400;
   color: #FFFFFF;
   line-height: 0.36rem;
@@ -1552,7 +1550,7 @@ margin: 0;
 }
 .page-5678-kong .you{
   font-size: 0.48rem;
-  font-family: PingFang SC-Bold, PingFang SC;
+
   font-weight: bold;
   color: #FFFFFF;
   line-height: 0.56rem;
@@ -1561,7 +1559,7 @@ margin: 0;
 }
 .page-5678-kong .num{
   font-size: 0.28rem;
-  font-family: PingFang SC-Regular, PingFang SC;
+
   font-weight: 400;
   color: #FFFFFF;
   line-height: 0.36rem;
@@ -1570,7 +1568,7 @@ margin: 0;
 }
 .page-5678-kong .text{
   font-size: 0.32rem;
-  font-family: PingFang SC-Bold, PingFang SC;
+
   font-weight: bold;
   color: #FFFFFF;
   line-height: 0.36rem;
@@ -1579,7 +1577,7 @@ margin: 0;
 }
 .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;
@@ -1591,10 +1589,9 @@ margin: 0;
 .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;
@@ -1630,7 +1627,7 @@ margin: 0;
 }
 .page-10-kong .year{
 font-size: 0.48rem;
-font-family: PingFang SC-Bold, PingFang SC;
+
 font-weight: bold;
 color: #FFFFFF;
 line-height: 0.56rem;
@@ -1639,7 +1636,7 @@ 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;
@@ -1662,7 +1659,7 @@ margin-top: 0.32rem;
 }
 .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;
@@ -1676,7 +1673,7 @@ margin-top: 0.32rem;
 }
 .page-10-kong .text{
 font-size: 0.28rem;
-font-family: PingFang SC-Regular, PingFang SC;
+
 font-weight: 400;
 color: #FFFFFF;
 line-height: 0.36rem;
@@ -1737,7 +1734,7 @@ letter-spacing: 4px;
 }
 .page-11-kong .year{
   font-size: 0.48rem;
-  font-family: PingFang SC-Bold, PingFang SC;
+
   font-weight: bold;
   color: #FFFFFF;
   line-height: 0.56rem;
@@ -1746,7 +1743,7 @@ letter-spacing: 4px;
 }
 .page-11-kong .you{
   font-size: 0.32rem;
-  font-family: PingFang SC-Regular, PingFang SC;
+
   font-weight: 400;
   color: #FFFFFF;
   line-height: 0.36rem;
@@ -1763,7 +1760,7 @@ letter-spacing: 4px;
 }
 .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;
@@ -1772,7 +1769,7 @@ letter-spacing: 4px;
 }
 .page-11-kong .text{
 font-size: 0.28rem;
-font-family: PingFang SC-Regular, PingFang SC;
+
 font-weight: 400;
 color: #FFFFFF;
 line-height: 0.52rem;
@@ -1783,10 +1780,9 @@ margin-top: 2.56rem;
 .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;

+ 3 - 0
src/web/staticres/common-module/yearEndReport/js/index.js

@@ -206,6 +206,9 @@ var vPage = new Vue({
                 type: 'GET',
                 success: function (res) {
                     console.log(res)
+                    if (res && res.error_msg === '' && res.data) {
+                        _this.pageInfo = res.data
+                    }
                 },
                 error: function () {
                     var res = {

+ 96 - 90
src/web/templates/active/yearEndReport/index.html

@@ -57,7 +57,7 @@
                                 <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">
+                                <input @change="changeReadPact" v-model="readPact" type="checkbox" autocomplete="off" id="read">
                                 <label for="read">同意剑鱼统计我的使用数据,</label><a href="/front/staticPage/privacy_rules.html">查看授权协议</a>
                             </div>
                         </div>
@@ -81,7 +81,7 @@
                             <p animate-name="up" animate-delay="200" class="hello">${pageInfo.user_name},你好呀!</p>
                             <p animate-name="up" animate-delay="400" style="margin-top: 0.32rem; margin-left: 1.54rem;">
                                 <span class="text">还记得</span>
-                                <span class="time">${pageInfo.registration_time}</span>
+                                <span class="time">${pageInfo.registration_time | dateFormat}</span>
                                 <span class="text">吗?</span>
                             </p>
                             <div class="star-two">
@@ -108,9 +108,9 @@
                 <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">第${pageInfo.total_days}天</div>
+                            <div class="today" animate-name="up" animate-delay="200">今天</div>
+                            <div class="text" animate-name="up" animate-delay="400">是我们一起同行的</div>
+                            <div class="days" animate-name="up" animate-delay="600">第${pageInfo.total_days}天</div>
                         </div>
                         <div class="star-three">
                             <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P3/star-three.png" alt="">
@@ -121,7 +121,7 @@
                         <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">
+                        <p class="moqi" animate-name="up" animate-delay="800" >
                             <span class="mf">“免费看,不遮挡”的承诺</span>
                             <span class="mf" style="margin-top: 0.16rem;">是你我之间的永久的默契</span>
                         </p>
@@ -136,11 +136,11 @@
                     <div class="report-page page-4">
                         <div class="year">
                             <div class="text-1">
-                                <div class="jin">近一年</div>
+                                <div class="jin" animate-name="up" animate-delay="200" >近一年</div>
                                 <div class="day">
-                                    <div class="ty">你登录了</div>
-                                    <div class="days">${pageInfo.login_days}天</div>
-                                    <div class="ty">剑鱼标讯</div>
+                                    <div class="ty" animate-name="up" animate-delay="400" >你登录了</div>
+                                    <div class="days" animate-name="up" animate-delay="600" >${pageInfo.login_days}天</div>
+                                    <div class="ty" animate-name="up" animate-delay="700" >剑鱼标讯</div>
                                 </div>
                             </div>
                             <div class="sm-four">
@@ -154,17 +154,17 @@
                             </div>
                             <div class="text-2">
                                 <div class="night">
-                                    <div class="big-day">有${pageInfo.active_days}天</div>
-                                    <div class="ty">的深夜</div>
+                                    <div class="big-day" animate-name="up" animate-delay="800" >有${pageInfo.active_days}天</div>
+                                    <div class="ty" animate-name="up" animate-delay="900" >的深夜</div>
                                 </div>
-                                <div class="ty" style="margin-left: 2.52rem;">仍在使用剑鱼标讯</div>
+                                <div class="ty" animate-name="up" animate-delay="1000"  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 class="text-3" animate-name="up" animate-delay="1200" >不是投标人爱熬夜</div>
+                                <div class="text-3" animate-name="up" animate-delay="1400" style="margin-top: 0.16rem;">是黑夜需要投标人这颗璀璨的星</div>
                             </div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
@@ -177,9 +177,9 @@
                 <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="this" animate-name="up" animate-delay="200" >近一年</div>
+                            <div class="gongsi" animate-name="up" animate-delay="400" >郑州大学第一附属医院<br>LED显示屏系统</div>
+                            <div class="guanzhu" animate-name="up" animate-delay="600" >是你最关注的项目</div>
                             <div class="yun-five">
                                 <img class="swiper-lazy" data-src="{{Msg "seo" "cdn"}}/common-module/yearEndReport/images/P5/yun-five.png" alt="">
                             </div>
@@ -191,8 +191,8 @@
                             </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>
+                                <p animate-name="up" animate-delay="800" >无论结果如何,我知道</p>
+                                <p animate-name="up" animate-delay="1000"  style="margin-top: 0.16rem;">这些标讯对你来说一定有特别的意义</p>
                             </div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
@@ -205,33 +205,33 @@
                 <div class="slide-inner">
                     <div class="report-page page-6">
                         <div class="message">
-                            <div class="year">近一年</div>
-                            <div class="you">你一共浏览了</div>
-                            <div class="num">${pageInfo.view_total}条</div>
-                            <div class="xiangmu">项目信息</div>
+                             <div class="year" animate-name="up" animate-delay="200" >近一年</div>
+                            <div class="you" animate-name="up" animate-delay="400" >你一共浏览了</div>
+                            <div class="num" animate-name="up" animate-delay="600" >${pageInfo.view_total}条</div>
+                            <div class="xiangmu" animate-name="up" animate-delay="700" >项目信息</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>
+                                <p animate-name="up" animate-delay="800" >精准、及时的数据</p>
+                                <p animate-name="up" animate-delay="1000"  style="margin-top: 0.16rem;">都源于剑鱼悄悄的努力</p>
                             </div>
                             <div class="text-two">
-                                <div class="box">
+                                <div class="box" animate-name="up" animate-delay="1100" >
                                     <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">
+                                <div class="box" animate-name="up" animate-delay="1200" >
                                     <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="text-bottom" animate-name="up" animate-delay="1400" >让你不遗漏任何商机</div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
                             </div>
@@ -243,11 +243,11 @@
                 <div class="slide-inner">
                     <div class="report-page page-7">
                         <div class="sum">
-                            <div class="year">近一年</div>
-                            <div class="you">你搜索了</div>
-                            <div class="num">${pageInfo.search_total}次</div>
+                            <div class="year" animate-name="up" animate-delay="200" >近一年</div>
+                            <div class="you" animate-name="up" animate-delay="400" >你搜索了</div>
+                            <div class="num" animate-name="up" animate-delay="600" >${pageInfo.search_total}次</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="text-bottom" animate-name="up" animate-delay="800" >求索力让你的成功触手可及</div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
                             </div>
@@ -259,15 +259,15 @@
                 <div class="slide-inner">
                     <div class="report-page page-8">
                         <div class="friend">
-                            <div class="year">近一年</div>
-                            <div class="num">${pageInfo.follow_total}个</div>
-                            <div class="you">企业成为你的新朋友</div>
+                            <div class="year" animate-name="up" animate-delay="200" >近一年</div>
+                            <div class="num" animate-name="up" animate-delay="400" >${pageInfo.follow_total}个</div>
+                            <div class="you" animate-name="up" animate-delay="600" >企业成为你的新朋友</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 class="text" animate-name="up" animate-delay="700" >通过企业搜索、采购单位画像</div>
+                                <div class="text" animate-name="up" animate-delay="800" >了解甲方、找到合作</div>
+                                <div class="text" animate-name="up" animate-delay="900" >果断的执行力,让无数人为你痴迷</div>
                             </div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
@@ -281,17 +281,17 @@
                     <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;">${pageInfo.active_month}月</span>
+                                <p class="nian" style="display: contents" animate-name="up" animate-delay="200" >近一年,</p>
+                                <div class="yue" style="color: #70EEFF;" animate-name="up" animate-delay="400" >${pageInfo.active_month}月</div>
                             </div>
-                            <div class="you">是你最繁忙的时候</div>
+                            <div class="you" animate-name="up" animate-delay="600" >是你最繁忙的时候</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 class="text" animate-name="up" animate-delay="800" >或许奔波在投标路上</div>
+                                <div class="text" animate-name="up" animate-delay="900" >或许驰骋在投标知识的海洋</div>
+                                <div class="text" animate-name="up" animate-delay="1000" >追梦的你,满怀热忱</div>
                             </div>
-                            <div class="banner-yue">
+                            <div class="banner-yue" animate-name="up" animate-delay="700" >
                                 <div class="banner-yue-one">${pageInfo.active_month}</div>
                                 <div class="banner-yue-two">月</div>
                             </div>
@@ -319,13 +319,13 @@
                             <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">${pageInfo.industry_total}条</span>
-                            <div class="gonggao">项目公告</div>
+                            <p class="year" animate-name="up" animate-delay="200" >近一年</p>
+                            <div class="you" animate-name="up" animate-delay="400" >你关注的行业累计发布了</div>
+                            <span class="num" animate-name="up" animate-delay="600" >${pageInfo.industry_total}条</span>
+                            <div class="gonggao" animate-name="up" animate-delay="800" >项目公告</div>
                             <div class="text-bottom">
-                                <div class="text">即使受到疫情的影响</div>
-                                <div class="text">投标人依旧稳步向前</div>
+                                <div class="text" animate-name="up" animate-delay="1000" >即使受到疫情的影响</div>
+                                <div class="text" animate-name="up" animate-delay="1200" >投标人依旧稳步向前</div>
                             </div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
@@ -344,13 +344,13 @@
                             <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">
+                            <p class="year" animate-name="up" animate-delay="200" >近一年</p>
+                            <div class="you" animate-name="up" animate-delay="400" >慧眼识珠的你,体验了剑鱼</div>
+                            <div class="gn" animate-name="up" animate-delay="600" >
                                 <span class="num">17个</span>
                                 <p class="new">新功能</p>
                             </div>
-                            <div class="list">
+                            <div class="list" animate-name="up" animate-delay="800" >
                                 <p>免费标讯搜索</p>
                                 <p>超级订阅</p>
                                 <p>大会员</p>
@@ -359,8 +359,8 @@
                                 <p>......</p>
                             </div>
                             <div class="text-bottom">
-                                <div class="text">从未枯竭的好奇心</div>
-                                <div class="text">让你看到了更大的世界</div>
+                                <div class="text" animate-name="up" animate-delay="1000" >从未枯竭的好奇心</div>
+                                <div class="text" animate-name="up" animate-delay="1200" >让你看到了更大的世界</div>
                             </div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
@@ -377,11 +377,11 @@
                                 <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 animate-name="up" animate-delay="500" class="btn">
+                                <p animate-name="up" animate-delay="200"  class="text-1">无论好的坏的</p>
+                                <div animate-name="up" animate-delay="300" class="text-1" style="margin-top: 0.16rem;">跌宕且绮丽的2021已结束</div>
+                                <div animate-name="up" animate-delay="400" class="text-3">凛冬散尽,星河长明</div>
+                                <div animate-name="up" animate-delay="500" class="text-1" style="margin-top: 1.04rem;">为你生成2021年度角色报告</div>
+                                <div animate-name="up" animate-delay="800" class="btn">
                                     <div class="go-button" @click="goResult">生成报告</div>
                                 </div>
                                 <div class="xd-twelve">
@@ -404,25 +404,27 @@
                     <div class="report-page page-new-0">
                         <div class="new-zero">
                             <div class="text">
-                                <div class="year">2021</div>
+                                <div class="year" animate-name="up" animate-delay="200" >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>
+                                    <p animate-name="up" animate-delay="300" >遗憾没有和您相遇</p>
+                                    <p animate-name="up" animate-delay="400" >但所有的遗憾</p>
+                                    <p animate-name="up" animate-delay="500" >都是2022惊喜的铺垫</p>
                                 </div>
                                 <div class="text-2">
-                                    <div>招免费看,不遮挡服务初心不改</div>
-                                    <div>商机线索推荐、AI智能服务中标创新永不停歇</div>
+                                    <div animate-name="up" animate-delay="700" >招免费看,不遮挡服务初心不改</div>
+                                    <div animate-name="up" animate-delay="800" >商机线索推荐、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="year" style="margin-top: 3.56rem;" animate-name="up" animate-delay="200" >新的一年</div>
                                 <div class="text-3">
-                                    <div>期待能和你肩并肩</div>
-                                    <div>走的更远</div>
+                                    <div animate-name="up" animate-delay="1000" >期待能和你肩并肩</div>
+                                    <div animate-name="up" animate-delay="1200" >走的更远</div>
+                                </div>
+                                <div animate-name="up" animate-delay="1300" class="btn">
+                                    <div class="go-button" @click="goResult">即刻体验</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">
@@ -436,13 +438,15 @@
                 <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="year" animate-name="up" animate-delay="200" >你可能是个慢热的人</div>
+                            <div class="you" animate-name="up" animate-delay="400" >这一年</div>
+                            <div class="num" animate-name="up" animate-delay="600" >还未有项目和企业成功引起你的关注</div>
+                            <div class="text" animate-name="up" animate-delay="800" >不急,未来会有的</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="text-bottom" animate-name="up" animate-delay="900" >点击试用一下,会有惊喜</div>
+                            <div animate-name="up" animate-delay="1100" class="btn">
+                                <div class="go-button" @click="goResult">试用一下</div>
+                            </div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
                             </div>
@@ -466,15 +470,15 @@
                             <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>
+                            <p class="year" animate-name="up" animate-delay="200" >近一年</p>
+                            <div class="you" animate-name="up" animate-delay="400" >你的忙碌都有了收获</div>
                             <div class="text-zg">
-                                <div>通过及时的标讯信息</div>
-                                <div style="margin-top: 0.24rem;">找合作、找甲方、找商机</div>
+                                <div animate-name="up" animate-delay="600" >通过及时的标讯信息</div>
+                                <div animate-name="up" animate-delay="800"  style="margin-top: 0.24rem;">找合作、找甲方、找商机</div>
                             </div>
                             <div class="text-bottom">
-                                <div class="text">即使受到疫情影响</div>
-                                <div class="text">依旧稳步向前</div>
+                                <div class="text" animate-name="up" animate-delay="1000" >即使受到疫情影响</div>
+                                <div class="text" animate-name="up" animate-delay="1200" >依旧稳步向前</div>
                             </div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
@@ -493,16 +497,18 @@
                             <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 class="year" animate-name="up" animate-delay="200" >近一年</p>
+                            <div class="you" animate-name="up" animate-delay="400" >剑鱼产品不断迭代</div>
+                            <div class="list" animate-name="up" animate-delay="600" >
                                 <p>超级订阅V4.0</p>
                                 <p>大会员V2.0</p>
                                 <p>数据流量包</p>
                                 <p>......</p>
                             </div>
-                            <div class="text">期待您有更好的体验</div>
-                            <div class="btn">试用一下</div>
+                            <div class="text" animate-name="up" animate-delay="800" >期待您有更好的体验</div>
+                            <div animate-name="up" animate-delay="1100" class="btn">
+                                <div class="go-button" @click="goResult">试用一下</div>
+                            </div>
                             <div class="btn-next">
                                 <div class="next-page"></div>
                             </div>