Skip to content

dev / pingan-life-index-pro

Go to a project
Toggle navigation
Toggle navigation pinning
c3094f65 by simon
Options

#46 #23 修复

1 parent 5b9a2439
Inline Side-by-side
Showing 21 changed files with 652 additions and 639 deletions
1 @import '@/styles/_support.scss'; 1 @import "@/styles/_support.scss";
2 2
3 $borderSize: 6px; 3 $borderSize: 6px;
4 4
...@@ -69,8 +69,6 @@ $borderSize: 6px; ...@@ -69,8 +69,6 @@ $borderSize: 6px;
69 letter-spacing: 1.5px; 69 letter-spacing: 1.5px;
70 } 70 }
71 } 71 }
72
73
74 } 72 }
75 } 73 }
76 74
...@@ -101,7 +99,6 @@ $borderSize: 6px; ...@@ -101,7 +99,6 @@ $borderSize: 6px;
101 } 99 }
102 100
103 .banner-tips { 101 .banner-tips {
104
105 position: absolute; 102 position: absolute;
106 z-index: 2; 103 z-index: 2;
107 width: 422px; 104 width: 422px;
...@@ -110,7 +107,7 @@ $borderSize: 6px; ...@@ -110,7 +107,7 @@ $borderSize: 6px;
110 top: 50px; 107 top: 50px;
111 padding: 2px; 108 padding: 2px;
112 // border-radius: $borderSize; 109 // border-radius: $borderSize;
113 background-image: url('~@assets/images/vhis/vhis-tips-bg.png'); 110 background-image: url("~@assets/images/vhis/vhis-tips-bg.png");
114 @extend .bis; 111 @extend .bis;
115 112
116 .close { 113 .close {
...@@ -151,7 +148,6 @@ $borderSize: 6px; ...@@ -151,7 +148,6 @@ $borderSize: 6px;
151 font-weight: bold; 148 font-weight: bold;
152 color: $cOrange2; 149 color: $cOrange2;
153 } 150 }
154
155 } 151 }
156 } 152 }
157 } 153 }
...@@ -164,7 +160,8 @@ $borderSize: 6px; ...@@ -164,7 +160,8 @@ $borderSize: 6px;
164 text-align: center; 160 text-align: center;
165 font-size: $fontSize; 161 font-size: $fontSize;
166 162
167 .tt {} 163 .tt {
164 }
168 165
169 .t1 { 166 .t1 {
170 color: $cOrange2; 167 color: $cOrange2;
...@@ -176,8 +173,6 @@ $borderSize: 6px; ...@@ -176,8 +173,6 @@ $borderSize: 6px;
176 } 173 }
177 } 174 }
178 175
179
180
181 .t2 { 176 .t2 {
182 font-size: 24px; 177 font-size: 24px;
183 line-height: 1.39; 178 line-height: 1.39;
...@@ -189,8 +184,6 @@ $borderSize: 6px; ...@@ -189,8 +184,6 @@ $borderSize: 6px;
189 letter-spacing: 2px; 184 letter-spacing: 2px;
190 } 185 }
191 } 186 }
192
193
194 } 187 }
195 188
196 // 产品 189 // 产品
...@@ -208,8 +201,6 @@ $borderSize: 6px; ...@@ -208,8 +201,6 @@ $borderSize: 6px;
208 } 201 }
209 } 202 }
210 203
211
212
213 .prod { 204 .prod {
214 margin: 24px auto 0; 205 margin: 24px auto 0;
215 color: $cOrange2; 206 color: $cOrange2;
...@@ -217,7 +208,6 @@ $borderSize: 6px; ...@@ -217,7 +208,6 @@ $borderSize: 6px;
217 justify-content: space-between; 208 justify-content: space-between;
218 flex-wrap: wrap; 209 flex-wrap: wrap;
219 210
220
221 &-item { 211 &-item {
222 @extend .fcc; 212 @extend .fcc;
223 width: 582px; 213 width: 582px;
...@@ -260,8 +250,6 @@ $borderSize: 6px; ...@@ -260,8 +250,6 @@ $borderSize: 6px;
260 } 250 }
261 } 251 }
262 252
263
264
265 .more { 253 .more {
266 display: flex; 254 display: flex;
267 margin-top: 6px; 255 margin-top: 6px;
...@@ -280,8 +268,6 @@ $borderSize: 6px; ...@@ -280,8 +268,6 @@ $borderSize: 6px;
280 letter-spacing: 1.2px; 268 letter-spacing: 1.2px;
281 } 269 }
282 } 270 }
283
284
285 } 271 }
286 272
287 .desc { 273 .desc {
...@@ -331,8 +317,6 @@ $borderSize: 6px; ...@@ -331,8 +317,6 @@ $borderSize: 6px;
331 } 317 }
332 } 318 }
333 319
334
335
336 .tit-s { 320 .tit-s {
337 font-size: $fontSize-M2; 321 font-size: $fontSize-M2;
338 color: $cFontGray2; 322 color: $cFontGray2;
...@@ -401,7 +385,6 @@ $borderSize: 6px; ...@@ -401,7 +385,6 @@ $borderSize: 6px;
401 } 385 }
402 } 386 }
403 387
404
405 .label { 388 .label {
406 padding-left: 28px; 389 padding-left: 28px;
407 border-right: solid 1px #e4e4e5; 390 border-right: solid 1px #e4e4e5;
...@@ -414,7 +397,7 @@ $borderSize: 6px; ...@@ -414,7 +397,7 @@ $borderSize: 6px;
414 .val { 397 .val {
415 flex: 1; 398 flex: 1;
416 399
417 .mark{ 400 .mark {
418 display: inline-block; 401 display: inline-block;
419 color: $cOrange2; 402 color: $cOrange2;
420 } 403 }
...@@ -423,7 +406,7 @@ $borderSize: 6px; ...@@ -423,7 +406,7 @@ $borderSize: 6px;
423 margin-left: -13px; 406 margin-left: -13px;
424 } 407 }
425 408
426 .star{ 409 .star {
427 margin-right: 4px; 410 margin-right: 4px;
428 margin-top: 4px; 411 margin-top: 4px;
429 } 412 }
...@@ -491,7 +474,7 @@ $borderSize: 6px; ...@@ -491,7 +474,7 @@ $borderSize: 6px;
491 li { 474 li {
492 @extend .bb; 475 @extend .bb;
493 position: relative; 476 position: relative;
494 background-image: url('~@assets/images/vhis/vhis-tick.png'); 477 background-image: url("~@assets/images/vhis/vhis-tick.png");
495 background-repeat: no-repeat; 478 background-repeat: no-repeat;
496 background-position: 0 5px; 479 background-position: 0 5px;
497 padding-left: 40px; 480 padding-left: 40px;
...@@ -506,7 +489,7 @@ $borderSize: 6px; ...@@ -506,7 +489,7 @@ $borderSize: 6px;
506 489
507 .label2 { 490 .label2 {
508 li { 491 li {
509 background-image: url('~@assets/images/vhis/vhis-cross.png'); 492 background-image: url("~@assets/images/vhis/vhis-cross.png");
510 } 493 }
511 494
512 .t1 { 495 .t1 {
...@@ -519,7 +502,8 @@ $borderSize: 6px; ...@@ -519,7 +502,8 @@ $borderSize: 6px;
519 } 502 }
520 } 503 }
521 504
522 .val {} 505 .val {
506 }
523 } 507 }
524 } 508 }
525 } 509 }
...@@ -528,7 +512,8 @@ $borderSize: 6px; ...@@ -528,7 +512,8 @@ $borderSize: 6px;
528 .guarantee2 { 512 .guarantee2 {
529 $cellPadding: 6px; 513 $cellPadding: 6px;
530 514
531 .tit {} 515 .tit {
516 }
532 517
533 .container { 518 .container {
534 display: flex; 519 display: flex;
...@@ -565,7 +550,8 @@ $borderSize: 6px; ...@@ -565,7 +550,8 @@ $borderSize: 6px;
565 padding-right: 2px; 550 padding-right: 2px;
566 justify-content: flex-start; 551 justify-content: flex-start;
567 552
568 .nn {} 553 .nn {
554 }
569 555
570 .n1 { 556 .n1 {
571 text-align: left; 557 text-align: left;
...@@ -602,11 +588,9 @@ $borderSize: 6px; ...@@ -602,11 +588,9 @@ $borderSize: 6px;
602 // padding: 0 4px; 588 // padding: 0 4px;
603 } 589 }
604 } 590 }
605
606 } 591 }
607 592
608 &-item-4 { 593 &-item-4 {
609
610 .val { 594 .val {
611 align-items: flex-start; 595 align-items: flex-start;
612 text-align: center; 596 text-align: center;
...@@ -627,7 +611,6 @@ $borderSize: 6px; ...@@ -627,7 +611,6 @@ $borderSize: 6px;
627 } 611 }
628 612
629 &-item-3 { 613 &-item-3 {
630
631 .val { 614 .val {
632 align-items: flex-start; 615 align-items: flex-start;
633 text-align: center; 616 text-align: center;
...@@ -665,7 +648,6 @@ $borderSize: 6px; ...@@ -665,7 +648,6 @@ $borderSize: 6px;
665 } 648 }
666 } 649 }
667 } 650 }
668
669 } 651 }
670 } 652 }
671 } 653 }
...@@ -682,7 +664,7 @@ $borderSize: 6px; ...@@ -682,7 +664,7 @@ $borderSize: 6px;
682 margin: 0 auto 24px; 664 margin: 0 auto 24px;
683 max-width: 602px; 665 max-width: 602px;
684 height: 67px; 666 height: 67px;
685 line-height: 67px; 667 // line-height: 67px;
686 cursor: pointer; 668 cursor: pointer;
687 @include border-tans($borderSize); 669 @include border-tans($borderSize);
688 670
...@@ -704,41 +686,53 @@ $borderSize: 6px; ...@@ -704,41 +686,53 @@ $borderSize: 6px;
704 margin-right: 48px; 686 margin-right: 48px;
705 } 687 }
706 688
707 689 &:lang(zh) {
708 &:lang(zh){
709 padding-left: 178px; 690 padding-left: 178px;
710 } 691 }
711 }
712
713 692
693 .desc{
694 flex: 1;
695 text-align: left;
696 }
697 }
714 } 698 }
715 } 699 }
716 700
717 // 提交订单 701 // 立即投保
718 .submit-btn { 702 .btn-wrap {
719 margin: 50px auto 100px; 703 margin: 50px auto 100px;
720 @extend .pointer; 704 display: flex;
721 @extend .bb; 705 justify-content: center;
722 @include btc4(300px, 50px, 22px); 706
723 font-weight: bold; 707 .submit-btn {
708 @extend .fcc;
709 @extend .bb;
710 @include btc4(300px, 50px, 22px);
711 line-height: normal;
712 min-width: 300px;
713 min-height: 50px;
714 height: auto;
715 width: auto;
716 font-weight: bold;
717 // display: inline-block;
718 padding: 4px 20px;
719 }
724 } 720 }
725 721
726
727 .small { 722 .small {
728 font-size: 14px; 723 font-size: 14px;
729 display: inline-block; 724 display: inline-block;
730 vertical-align: text-top; 725 vertical-align: text-top;
731 } 726 }
732 727
733
734 // banner点点 728 // banner点点
735 .swiper-button-prev { 729 .swiper-button-prev {
736 background-image: url('~@/assets/images/common/button-prev.png'); 730 background-image: url("~@/assets/images/common/button-prev.png");
737 left: 360px; 731 left: 360px;
738 } 732 }
739 733
740 .swiper-button-next { 734 .swiper-button-next {
741 background-image: url('~@/assets/images/common/button-next.png'); 735 background-image: url("~@/assets/images/common/button-next.png");
742 right: 360px; 736 right: 360px;
743 } 737 }
744 738
...@@ -748,7 +742,7 @@ $borderSize: 6px; ...@@ -748,7 +742,7 @@ $borderSize: 6px;
748 742
749 .swiper-pagination-fraction, 743 .swiper-pagination-fraction,
750 .swiper-pagination-custom, 744 .swiper-pagination-custom,
751 .swiper-container-horizontal>.swiper-pagination-bullets { 745 .swiper-container-horizontal > .swiper-pagination-bullets {
752 bottom: 48px; 746 bottom: 48px;
753 } 747 }
754 748
...@@ -768,7 +762,6 @@ $borderSize: 6px; ...@@ -768,7 +762,6 @@ $borderSize: 6px;
768 width: 100%; 762 width: 100%;
769 } 763 }
770 764
771
772 @media (max-width: 1200px) { 765 @media (max-width: 1200px) {
773 .content { 766 .content {
774 @include content-percent(); 767 @include content-percent();
...@@ -794,11 +787,9 @@ $borderSize: 6px; ...@@ -794,11 +787,9 @@ $borderSize: 6px;
794 } 787 }
795 } 788 }
796 } 789 }
797
798 } 790 }
799 791
800 @media (max-width: 768px) { 792 @media (max-width: 768px) {
801
802 .banner-tips { 793 .banner-tips {
803 display: none; 794 display: none;
804 } 795 }
...@@ -821,7 +812,6 @@ $borderSize: 6px; ...@@ -821,7 +812,6 @@ $borderSize: 6px;
821 } 812 }
822 813
823 .content { 814 .content {
824
825 // 产品 815 // 产品
826 .product { 816 .product {
827 margin: 48px auto 0; 817 margin: 48px auto 0;
...@@ -873,7 +863,6 @@ $borderSize: 6px; ...@@ -873,7 +863,6 @@ $borderSize: 6px;
873 .guarantee { 863 .guarantee {
874 margin: 32px auto 0; 864 margin: 32px auto 0;
875 865
876
877 .tit { 866 .tit {
878 font-size: $fontSizeTitle-M2; 867 font-size: $fontSizeTitle-M2;
879 } 868 }
...@@ -885,15 +874,14 @@ $borderSize: 6px; ...@@ -885,15 +874,14 @@ $borderSize: 6px;
885 .table { 874 .table {
886 font-size: $fontSize-M2; 875 font-size: $fontSize-M2;
887 876
888
889 &-item { 877 &-item {
890 display: flex; 878 display: flex;
891 flex-wrap: nowrap; 879 flex-wrap: nowrap;
892 880
893 .tt { 881 .tt {
894 // width: 100%; 882 // width: 100%;
895 .ff{ 883 .ff {
896 .nn{ 884 .nn {
897 padding: 24px 0; 885 padding: 24px 0;
898 } 886 }
899 } 887 }
...@@ -912,12 +900,11 @@ $borderSize: 6px; ...@@ -912,12 +900,11 @@ $borderSize: 6px;
912 } 900 }
913 } 901 }
914 902
915 &-item2{ 903 &-item2 {
916 } 904 }
917 } 905 }
918 } 906 }
919 907
920
921 // 下载 908 // 下载
922 .download { 909 .download {
923 margin: 48px auto 0; 910 margin: 48px auto 0;
...@@ -937,7 +924,6 @@ $borderSize: 6px; ...@@ -937,7 +924,6 @@ $borderSize: 6px;
937 .icon { 924 .icon {
938 margin-right: 24px; 925 margin-right: 24px;
939 } 926 }
940
941 } 927 }
942 } 928 }
943 } 929 }
......
1 1
2 <template> 2 <template>
3 <div class="page page-vhis"> 3 <div class="page page-vhis">
4 <div class="banner-contaner"> 4 <div class="banner-contaner">
5 <!-- banner 轮播 --> 5 <!-- banner 轮播 -->
6 6
7 <div class="banner banner-pc"> 7 <div class="banner banner-pc">
8 <swiper :options="swiperOption"> 8 <swiper :options="swiperOption">
9 <swiper-slide v-for="(item,index) in bannerList" :key="index"> 9 <swiper-slide v-for="(item,index) in bannerList" :key="index">
10 <img class="banner-img" :src="item.pcBannerUrl" /> 10 <img class="banner-img" :src="item.pcBannerUrl" />
11 <div class="btn-wrap"> 11 <div class="btn-wrap">
12 <div v-for="(btnItem, btnIndex) in item.btns" :key="btnIndex"> 12 <div v-for="(btnItem, btnIndex) in item.btns" :key="btnIndex">
13 <div class="banner-btn" v-if="btnItem.n && btnItem.t && btnItem.c" @click="btnNavigateTo(btnItem.t,btnItem.l)" :style="{backgroundColor:btnItem.c}">{{btnItem.n}}</div> 13 <div class="banner-btn" v-if="btnItem.n && btnItem.t && btnItem.c" @click="btnNavigateTo(btnItem.t,btnItem.l)" :style="{backgroundColor:btnItem.c}">{{btnItem.n}}</div>
14 </div> 14 </div>
15 </div> 15 </div>
16 </swiper-slide> 16 </swiper-slide>
17 <!-- <div class="swiper-button-prev" slot="button-prev"></div> 17 <!-- <div class="swiper-button-prev" slot="button-prev"></div>
18 <div class="swiper-button-next" slot="button-next"></div>--> 18 <div class="swiper-button-next" slot="button-next"></div>-->
19 <!-- <div class="swiper-pagination" slot="pagination"></div> --> 19 <!-- <div class="swiper-pagination" slot="pagination"></div> -->
20 </swiper> 20 </swiper>
21 </div> 21 </div>
22 22
23 <div class="banner banner-mobile"> 23 <div class="banner banner-mobile">
24 <swiper class="swiper" :options="swiperOption"> 24 <swiper class="swiper" :options="swiperOption">
25 <swiper-slide v-for="(item,index) in bannerList" :key="index"> 25 <swiper-slide v-for="(item,index) in bannerList" :key="index">
26 <img class="banner-img" :src="item.mobileBannerUrl" /> 26 <img class="banner-img" :src="item.mobileBannerUrl" />
27 <div class="btn-wrap"> 27 <div class="btn-wrap">
28 <div class="banner-btn" v-for="(btnItem, btnIndex) in item.btns" :key="btnIndex" @click="btnNavigateTo(btnItem.t,btnItem.l)" :style="{color:btnItem.c}">{{btnItem.n}}&nbsp;&gt;</div> 28 <div class="banner-btn" v-for="(btnItem, btnIndex) in item.btns" :key="btnIndex" @click="btnNavigateTo(btnItem.t,btnItem.l)" :style="{color:btnItem.c}">{{btnItem.n}}&nbsp;&gt;</div>
29 </div> 29 </div>
30 </swiper-slide> 30 </swiper-slide>
31 <div class="swiper-pagination" slot="pagination"></div> 31 <div class="swiper-pagination" slot="pagination"></div>
32 </swiper> 32 </swiper>
33 </div> 33 </div>
34 <!-- <div class="swiper-button-prev" slot="button-prev"></div> 34 <!-- <div class="swiper-button-prev" slot="button-prev"></div>
35 <div class="swiper-button-next" slot="button-next"></div>--> 35 <div class="swiper-button-next" slot="button-next"></div>-->
36 36
37 <div v-if="bannerTipsVisible" class="banner-tips"> 37 <div v-if="bannerTipsVisible" class="banner-tips">
38 <div class="cont"> 38 <div class="cont">
39 <div class="tit"> 39 <div class="tit">
40 <img class="icon" src="@/assets/images/vhis/hot-deal-icon.png" /> {{$t('genRich.bannerTips.t1')}} 40 <img class="icon" src="@/assets/images/vhis/hot-deal-icon.png" /> {{$t('genRich.bannerTips.t1')}}
41 </div> 41 </div>
42 <div class="desc"> 42 <div class="desc">
43 <div class="t1">{{$t('genRich.bannerTips.t2')}}</div> 43 <div class="t1">{{$t('genRich.bannerTips.t2')}}</div>
44 <div class="t2">{{$t('genRich.bannerTips.t3')}}</div> 44 <div class="t2">{{$t('genRich.bannerTips.t3')}}</div>
45 </div> 45 </div>
46 </div> 46 </div>
47 <img @click="onHideBannerTipsHandler" class="close" src="@/assets/images/vhis/close2.png" /> 47 <img @click="onHideBannerTipsHandler" class="close" src="@/assets/images/vhis/close2.png" />
48 </div> 48 </div>
49 </div> 49 </div>
50 <!-- 标题 --> 50 <!-- 标题 -->
51 <div class="title"> 51 <div class="title">
52 <div class="title-wrap"> 52 <div class="title-wrap">
53 <div class="tt t1">{{$t('genRich.title.t1')}}</div> 53 <div class="tt t1">{{$t('genRich.title.t1')}}</div>
54 <div class="tt t2">{{$t('genRich.title.t2')}}{{$t('genRich.title.t3')}}</div> 54 <div class="tt t2">{{$t('genRich.title.t2')}}{{$t('genRich.title.t3')}}</div>
55 </div> 55 </div>
56 </div> 56 </div>
57 57
58 <div class="content"> 58 <div class="content">
59 <!-- 产品特点 --> 59 <!-- 产品特点 -->
60 <div class="box product"> 60 <div class="box product">
61 <div class="tit">{{$t('genRich.main.t1')}}</div> 61 <div class="tit">{{$t('genRich.main.t1')}}</div>
62 <div class="prod"> 62 <div class="prod">
63 <div v-for="(item,index) in productList" :key="item.id" class="prod-item"> 63 <div v-for="(item,index) in productList" :key="item.id" class="prod-item">
64 <div class="cont"> 64 <div class="cont">
65 <div class="icon-wrap"> 65 <div class="icon-wrap">
66 <img :src="require('@/assets/images/gen-rich/gen-rich-icon'+(index+1)+'.png')" /> 66 <img :src="require('@/assets/images/gen-rich/gen-rich-icon'+(index+1)+'.png')" />
67 </div> 67 </div>
68 <div class="detail"> 68 <div class="detail">
69 <div class="t1" v-html="item.title">{{item.title}}</div> 69 <div class="t1" v-html="item.title">{{item.title}}</div>
70 <div class="more pointer" @click="onShowMoreHandler(index)"> 70 <div class="more pointer" @click="onShowMoreHandler(index)">
71 <div class="more-icon-wrap"> 71 <div class="more-icon-wrap">
72 <img v-if="item.showMore" src="@/assets/images/vhis/vhis-mine.png" /> 72 <img v-if="item.showMore" src="@/assets/images/vhis/vhis-mine.png" />
73 <img v-else src="@/assets/images/vhis/vhis-plus.png" /> 73 <img v-else src="@/assets/images/vhis/vhis-plus.png" />
74 </div> 74 </div>
75 <div class="c1">{{item.showMore ? $t('genRich.close') : $t('genRich.expand')}}</div> 75 <div class="c1">{{item.showMore ? $t('genRich.close') : $t('genRich.expand')}}</div>
76 </div> 76 </div>
77 <div v-if="item.showMore" class="desc"> 77 <div v-if="item.showMore" class="desc">
78 {{item.desc}} 78 {{item.desc}}
79 <div class="tips">{{item.tips}}</div> 79 <div class="tips">{{item.tips}}</div>
80 </div> 80 </div>
81 </div> 81 </div>
82 </div> 82 </div>
83 </div> 83 </div>
84 </div> 84 </div>
85 </div> 85 </div>
86 86
87 <!-- 视频 --> 87 <!-- 视频 -->
88 <div class="box video"> 88 <div class="box video">
89 <video-player class="vjs-custom-skin" ref="videoPlayer" :options="playerOptions" :playsinline="true"></video-player> 89 <video-player class="vjs-custom-skin" ref="videoPlayer" :options="playerOptions" :playsinline="true"></video-player>
90 </div> 90 </div>
91 91
92 <!-- 计划总览 --> 92 <!-- 计划总览 -->
93 <div class="guarantee"> 93 <div class="guarantee">
94 <div class="tit-wrap"> 94 <div class="tit-wrap">
95 <div class="tit">{{$t('genRich.guarantee1.title')}}</div> 95 <div class="tit">{{$t('genRich.guarantee1.title')}}</div>
96 <div class="tit-s"> 96 <div class="tit-s">
97 {{$t('genRich.guarantee1.titleT1')}} 97 {{$t('genRich.guarantee1.titleT1')}}
98 <span>{{$t('genRich.guarantee1.titleNum')}}</span> 98 <span>{{$t('genRich.guarantee1.titleNum')}}</span>
99 {{$t('genRich.guarantee1.titleT2')}} 99 {{$t('genRich.guarantee1.titleT2')}}
100 </div> 100 </div>
101 </div> 101 </div>
102 <div class="tit-lt">{{$t('genRich.guarantee1.titleLt')}}</div> 102 <div class="tit-lt">{{$t('genRich.guarantee1.titleLt')}}</div>
103 103
104 <div class="container"> 104 <div class="container">
105 <div class="table"> 105 <div class="table">
106 <div class="border2 table-border"></div> 106 <div class="border2 table-border"></div>
107 <div class="table-item table-item2"> 107 <div class="table-item table-item2">
108 <div class="tt label">{{$t('genRich.guarantee1.k1')}}</div> 108 <div class="tt label">{{$t('genRich.guarantee1.k1')}}</div>
109 <div class="tt val tt2"> 109 <div class="tt val tt2">
110 <div class="ff"> 110 <div class="ff">
111 <div class="nn nn1">{{$t('genRich.guarantee1.k11')}}</div> 111 <div class="nn nn1">{{$t('genRich.guarantee1.k11')}}</div>
112 <div class="nn nn2">{{$t('genRich.guarantee1.v11')}}</div> 112 <div class="nn nn2">{{$t('genRich.guarantee1.v11')}}</div>
113 </div> 113 </div>
114 <div class="ff"> 114 <div class="ff">
115 <div class="nn nn1">{{$t('genRich.guarantee1.k12')}}</div> 115 <div class="nn nn1">{{$t('genRich.guarantee1.k12')}}</div>
116 <div v-html="$t('genRich.guarantee1.v12')" class="nn nn2">{{$t('genRich.guarantee1.v12')}}</div> 116 <div v-html="$t('genRich.guarantee1.v12')" class="nn nn2">{{$t('genRich.guarantee1.v12')}}</div>
117 </div> 117 </div>
118 </div> 118 </div>
119 </div> 119 </div>
120 <div class="table-item"> 120 <div class="table-item">
121 <div class="tt label">{{$t('genRich.guarantee1.k2')}}</div> 121 <div class="tt label">{{$t('genRich.guarantee1.k2')}}</div>
122 <div class="tt val text-c">{{$t('genRich.guarantee1.v2')}}</div> 122 <div class="tt val text-c">{{$t('genRich.guarantee1.v2')}}</div>
123 </div> 123 </div>
124 <div class="table-item"> 124 <div class="table-item">
125 <div class="tt label">{{$t('genRich.guarantee1.k3')}}</div> 125 <div class="tt label">{{$t('genRich.guarantee1.k3')}}</div>
126 <div class="tt val text-c">{{$t('genRich.guarantee1.v3')}}</div> 126 <div class="tt val text-c">{{$t('genRich.guarantee1.v3')}}</div>
127 </div> 127 </div>
128 <div class="table-item"> 128 <div class="table-item">
129 <div class="tt label">{{$t('genRich.guarantee1.k4')}}</div> 129 <div class="tt label">{{$t('genRich.guarantee1.k4')}}</div>
130 <div class="tt val text-c">{{$t('genRich.guarantee1.v4')}}</div> 130 <div class="tt val text-c">{{$t('genRich.guarantee1.v4')}}</div>
131 </div> 131 </div>
132 <div class="table-item"> 132 <div class="table-item">
133 <div class="tt label">{{$t('genRich.guarantee1.k5')}}</div> 133 <div class="tt label">{{$t('genRich.guarantee1.k5')}}</div>
134 <div class="tt val"> 134 <div class="tt val">
135 {{$t('genRich.guarantee1.v5')}} 135 {{$t('genRich.guarantee1.v5')}}
136 <div class="fl"> 136 <div class="fl">
137 <span class="mark num">{{$t('genRich.guarantee1.num1')}}</span> 137 <span class="mark num">{{$t('genRich.guarantee1.num1')}}</span>
138 <div class="d1">{{$t('genRich.guarantee1.v51')}}</div> 138 <div class="d1">{{$t('genRich.guarantee1.v51')}}</div>
139 </div> 139 </div>
140 <div class="fl"> 140 <div class="fl">
141 <span class="mark num">{{$t('genRich.guarantee1.num2')}}</span> 141 <span class="mark num">{{$t('genRich.guarantee1.num2')}}</span>
142 <div class="d1">{{$t('genRich.guarantee1.v52')}}</div> 142 <div class="d1">{{$t('genRich.guarantee1.v52')}}</div>
143 </div> 143 </div>
144 </div> 144 </div>
145 </div> 145 </div>
146 <div class="table-item"> 146 <div class="table-item">
147 <div class="tt label">{{$t('genRich.guarantee1.k6')}}</div> 147 <div class="tt label">{{$t('genRich.guarantee1.k6')}}</div>
148 <div class="tt val"> 148 <div class="tt val">
149 {{$t('genRich.guarantee1.v6')}} 149 {{$t('genRich.guarantee1.v6')}}
150 <div class="fl"> 150 <div class="fl">
151 <span class="mark star">*</span> 151 <span class="mark star">*</span>
152 <div class="d1">{{$t('genRich.guarantee1.v61')}}</div> 152 <div class="d1">{{$t('genRich.guarantee1.v61')}}</div>
153 </div> 153 </div>
154 </div> 154 </div>
155 </div> 155 </div>
156 <div class="table-item"> 156 <div class="table-item">
157 <div class="tt label">{{$t('genRich.guarantee1.k7')}}</div> 157 <div class="tt label">{{$t('genRich.guarantee1.k7')}}</div>
158 <div class="tt val"> 158 <div class="tt val">
159 {{$t('genRich.guarantee1.v7')}} 159 {{$t('genRich.guarantee1.v7')}}
160 <div class="fl"> 160 <div class="fl">
161 <span class="mark star">*</span> 161 <span class="mark star">*</span>
162 <div class="d1">{{$t('genRich.guarantee1.v71')}}</div> 162 <div class="d1">{{$t('genRich.guarantee1.v71')}}</div>
163 </div> 163 </div>
164 <div class="fl"> 164 <div class="fl">
165 <span class="mark star">*</span> 165 <span class="mark star">*</span>
166 <div class="d1">{{$t('genRich.guarantee1.v72')}}</div> 166 <div class="d1">{{$t('genRich.guarantee1.v72')}}</div>
167 </div> 167 </div>
168 <div class="fl" v-if="$t('genRich.guarantee1.v73')"> 168 <div class="fl" v-if="$t('genRich.guarantee1.v73')">
169 <span class="mark star">*</span> 169 <span class="mark star">*</span>
170 <div class="d1">{{$t('genRich.guarantee1.v73')}}</div> 170 <div class="d1">{{$t('genRich.guarantee1.v73')}}</div>
171 </div> 171 </div>
172 </div> 172 </div>
173 </div> 173 </div>
174 <div class="table-item"> 174 <div class="table-item">
175 <div class="tt label">{{$t('genRich.guarantee1.k8')}}</div> 175 <div class="tt label">{{$t('genRich.guarantee1.k8')}}</div>
176 <div class="tt val">{{$t('genRich.guarantee1.v8')}}</div> 176 <div class="tt val">{{$t('genRich.guarantee1.v8')}}</div>
177 </div> 177 </div>
178 <div class="table-item"> 178 <div class="table-item">
179 <div class="tt label">{{$t('genRich.guarantee1.k9')}}</div> 179 <div class="tt label">{{$t('genRich.guarantee1.k9')}}</div>
180 <div class="tt val">{{$t('genRich.guarantee1.v9')}}</div> 180 <div class="tt val">{{$t('genRich.guarantee1.v9')}}</div>
181 </div> 181 </div>
182 <div class="table-item"> 182 <div class="table-item">
183 <div class="tt label">{{$t('genRich.guarantee1.k10')}}</div> 183 <div class="tt label">{{$t('genRich.guarantee1.k10')}}</div>
184 <div class="tt val">{{$t('genRich.guarantee1.v10')}}</div> 184 <div class="tt val">{{$t('genRich.guarantee1.v10')}}</div>
185 </div> 185 </div>
186 </div> 186 </div>
187 </div> 187 </div>
188 </div> 188 </div>
189 189
190 <!-- 下载 --> 190 <!-- 下载 -->
191 <div class="download"> 191 <div class="download">
192 <div class="border2 download-item"> 192 <div class="border2 download-item">
193 <div class="cont" @click="downloadFile('file1')"> 193 <div class="cont" @click="downloadFile('file1')">
194 <div class="icon-wrap"> 194 <div class="icon-wrap">
195 <img class="icon" src="@/assets/images/vhis/vhis-download.png" /> 195 <img class="icon" src="@/assets/images/vhis/vhis-download.png" />
196 </div> 196 </div>
197 {{$t('genRich.download.t1')}} 197 <div class="desc">{{$t('genRich.download.t1')}}</div>
198 </div>
199 </div>
200 <div class="border2 download-item">
201 <div class="cont" @click="downloadFile('file1')">
202 <div class="icon-wrap">
203 <img class="icon" src="@/assets/images/vhis/vhis-download.png" />
204 </div>
205 {{$t('genRich.download.t2')}}
206 </div>
207 </div>
208 </div>
209 198
210 <!-- 立即投保 --> 199 </div>
211 <div class="submit-btn" @click="bottomBtnHandle()">{{$t('genRich.submitBtn')}}</div> 200 </div>
212 </div> 201 <div class="border2 download-item">
213 </div> 202 <div class="cont" @click="downloadFile('file1')">
203 <div class="icon-wrap">
204 <img class="icon" src="@/assets/images/vhis/vhis-download.png" />
205 </div>
206 <div class="desc">{{$t('genRich.download.t2')}}</div>
207
208 </div>
209 </div>
210 </div>
211
212 <!-- 立即投保 -->
213 <div class="btn-wrap">
214 <div class="submit-btn" @click="bottomBtnHandle()">{{$t('genRich.submitBtn')}}</div>
215 </div>
216 </div>
217 </div>
214 </template> 218 </template>
215 219
216 <script src="./gen-rich.js"></script> 220 <script src="./gen-rich.js"></script>
......
...@@ -26,7 +26,7 @@ export default { ...@@ -26,7 +26,7 @@ export default {
26 data() { 26 data() {
27 return { 27 return {
28 key: "value", 28 key: "value",
29 29 img:require("@/assets/images/index/index-tab-2.png"),
30 PRODUCT_PRO_EASY: "PRODUCT_PRO_EASY", // 好医时 30 PRODUCT_PRO_EASY: "PRODUCT_PRO_EASY", // 好医时
31 PRODUCT_REN_RICH: "PRODUCT_REN_RICH", // 平安福 31 PRODUCT_REN_RICH: "PRODUCT_REN_RICH", // 平安福
32 // swiper 32 // swiper
...@@ -558,6 +558,7 @@ export default { ...@@ -558,6 +558,7 @@ export default {
558 element.btns = element.btnDescribe; 558 element.btns = element.btnDescribe;
559 }); 559 });
560 560
561
561 // 设置缓存 562 // 设置缓存
562 sessionStorage.setItem("_pingan_index_datalist", JSON.stringify(this.dataList)); 563 sessionStorage.setItem("_pingan_index_datalist", JSON.stringify(this.dataList));
563 sessionStorage.setItem("_pingan_index_bannerlist", JSON.stringify(this.bannerList)); 564 sessionStorage.setItem("_pingan_index_bannerlist", JSON.stringify(this.bannerList));
......
...@@ -289,11 +289,11 @@ ...@@ -289,11 +289,11 @@
289 display: flex; 289 display: flex;
290 justify-content: space-between; 290 justify-content: space-between;
291 &-item { 291 &-item {
292 background-image: url("~@/assets/images/index/index-tab.png"); 292 // background-image: url("~@/assets/images/index/index-tab-2.png");
293 293 @extend .bb;
294 @extend .bis; 294 @extend .bis;
295 @extend .fcc; 295 @extend .fcc;
296 height: 73px; 296 min-height: 73px;
297 font-size: $fontSize-M2; 297 font-size: $fontSize-M2;
298 color: $cOrange2; 298 color: $cOrange2;
299 font-weight: bold; 299 font-weight: bold;
...@@ -302,6 +302,7 @@ ...@@ -302,6 +302,7 @@
302 filter: drop-shadow(2px 0px 0px rgba(0, 0, 0, 0.3)); 302 filter: drop-shadow(2px 0px 0px rgba(0, 0, 0, 0.3));
303 303
304 margin-left: -120px; 304 margin-left: -120px;
305 padding: 12px 40px;
305 306
306 &:first-child { 307 &:first-child {
307 margin-left: 0; 308 margin-left: 0;
...@@ -312,7 +313,7 @@ ...@@ -312,7 +313,7 @@
312 } 313 }
313 314
314 &-act { 315 &-act {
315 background-image: url("~@/assets/images/index/index-tab-act.png"); 316 // background-image: url("~@/assets/images/index/index-tab-act-2.png");
316 color: #ffffff; 317 color: #ffffff;
317 } 318 }
318 } 319 }
......
...@@ -95,12 +95,9 @@ ...@@ -95,12 +95,9 @@
95 <div class="table" :class="{'table-1':dataList.length<=1}"> 95 <div class="table" :class="{'table-1':dataList.length<=1}">
96 <div class="table-tab" ref="quote"> 96 <div class="table-tab" ref="quote">
97 <!-- <div class="table-tab-item" @click="onTabHandler(item)" v-html="item.tabName" v-for="(item, index) in dataList" :key="item.id" :class="{ 'table-tab-item-act': item.index == curTab.index }" :style=" 97 <!-- <div class="table-tab-item" @click="onTabHandler(item)" v-html="item.tabName" v-for="(item, index) in dataList" :key="item.id" :class="{ 'table-tab-item-act': item.index == curTab.index }" :style="
98 'margin:0 -'+tableTapIndentation.mar+'px;width: calc(100% / ' + dataList.length + ');z-index:' + (dataList.length - index) + ''">{{ item.name }}</div> 98 ';width: '+(index == 0 ? 'calc(100% / ' + dataList.length + ')' : tableTapIndentation.wid + 'px' ) +' ;z-index:' + (dataList.length - index) + ''">{{ item.name }}</div> -->
99 </div> -->
100 <!-- <div class="linear" :style="'width: calc(100% - '+tableTapIndentation.ind+'px *' + (dataList.length - 1) + ')'"></div>
101 <div class="table-cont" :style="'width: calc(100% - '+tableTapIndentation.ind+'px *' + (dataList.length - 1) + ')'"> -->
102 <div class="table-tab-item" @click="onTabHandler(item)" v-html="item.tabName" v-for="(item, index) in dataList" :key="item.id" :class="{ 'table-tab-item-act': item.index == curTab.index }" :style=" 99 <div class="table-tab-item" @click="onTabHandler(item)" v-html="item.tabName" v-for="(item, index) in dataList" :key="item.id" :class="{ 'table-tab-item-act': item.index == curTab.index }" :style="
103 ';width: '+(index == 0 ? 'calc(100% / ' + dataList.length + ')' : tableTapIndentation.wid + 'px' ) +' ;z-index:' + (dataList.length - index) + ''">{{ item.name }}</div> 100 'width: '+(index == 0 ? 'calc(100% / ' + dataList.length + ')' : tableTapIndentation.wid + 'px' ) +' ;z-index:' + (dataList.length - index) + ';backgroundImage:url('+require('@/assets/images/index/index-tab'+(item.index == curTab.index?'-act':'')+'-'+dataList.length+'.png')+')'">{{ item.name }}</div>
104 </div> 101 </div>
105 <div class="linear"></div> 102 <div class="linear"></div>
106 <div class="table-wrap"> 103 <div class="table-wrap">
......
...@@ -619,7 +619,7 @@ $borderSize: 6px; ...@@ -619,7 +619,7 @@ $borderSize: 6px;
619 margin: 0 auto 24px; 619 margin: 0 auto 24px;
620 max-width: 602px; 620 max-width: 602px;
621 height: 67px; 621 height: 67px;
622 line-height: 67px; 622 // line-height: 67px;
623 cursor: pointer; 623 cursor: pointer;
624 @include border-tans($borderSize); 624 @include border-tans($borderSize);
625 625
...@@ -642,16 +642,34 @@ $borderSize: 6px; ...@@ -642,16 +642,34 @@ $borderSize: 6px;
642 } 642 }
643 643
644 } 644 }
645
646 .desc{
647 flex: 1;
648 text-align: left;
649 }
645 } 650 }
646 } 651 }
647 652
648 // 提交订单 653
649 .submit-btn { 654 // 立即投保
655 .btn-wrap {
650 margin: 50px auto 100px; 656 margin: 50px auto 100px;
651 @extend .pointer; 657 display: flex;
652 @extend .bb; 658 justify-content: center;
653 @include btc4(300px, 50px, 22px); 659
654 font-weight: bold; 660 .submit-btn {
661 @extend .fcc;
662 @extend .bb;
663 @include btc4(300px, 50px, 22px);
664 line-height: normal;
665 min-width: 300px;
666 min-height: 50px;
667 height: auto;
668 width: auto;
669 font-weight: bold;
670 // display: inline-block;
671 padding: 4px 20px;
672 }
655 } 673 }
656 674
657 675
...@@ -897,6 +915,7 @@ $borderSize: 6px; ...@@ -897,6 +915,7 @@ $borderSize: 6px;
897 } 915 }
898 916
899 .icon-wrap { 917 .icon-wrap {
918 // width: 34%;
900 width: 40%; 919 width: 40%;
901 display: flex; 920 display: flex;
902 justify-content: flex-end; 921 justify-content: flex-end;
......
1 1
2 <template> 2 <template>
3 <div class="page page-vhis"> 3 <div class="page page-vhis">
4 <div class="banner-contaner"> 4 <div class="banner-contaner">
5 <!-- banner 轮播 --> 5 <!-- banner 轮播 -->
6 6
7 <div class="banner banner-pc"> 7 <div class="banner banner-pc">
8 <swiper :options="swiperOption"> 8 <swiper :options="swiperOption">
9 <swiper-slide v-for="(item,index) in bannerList" :key="index"> 9 <swiper-slide v-for="(item,index) in bannerList" :key="index">
10 <img class="banner-img" :src="item.pcBannerUrl"> 10 <img class="banner-img" :src="item.pcBannerUrl">
11 <div class="btn-wrap"> 11 <div class="btn-wrap">
12 <div v-for="(btnItem, btnIndex) in item.btns" :key="btnIndex"> 12 <div v-for="(btnItem, btnIndex) in item.btns" :key="btnIndex">
13 <div class="banner-btn" v-if="btnItem.n && btnItem.t && btnItem.c" @click="btnNavigateTo(btnItem.t,btnItem.l)" :style="{backgroundColor:btnItem.c}">{{btnItem.n}}</div> 13 <div class="banner-btn" v-if="btnItem.n && btnItem.t && btnItem.c" @click="btnNavigateTo(btnItem.t,btnItem.l)" :style="{backgroundColor:btnItem.c}">{{btnItem.n}}</div>
14 </div> 14 </div>
15 </div> 15 </div>
16 </swiper-slide> 16 </swiper-slide>
17 <!-- <div class="swiper-button-prev" slot="button-prev"></div> 17 <!-- <div class="swiper-button-prev" slot="button-prev"></div>
18 <div class="swiper-button-next" slot="button-next"></div> --> 18 <div class="swiper-button-next" slot="button-next"></div> -->
19 <!-- <div class="swiper-pagination" slot="pagination"></div> --> 19 <!-- <div class="swiper-pagination" slot="pagination"></div> -->
20 </swiper> 20 </swiper>
21 </div> 21 </div>
22 22
23 <div class="banner banner-mobile"> 23 <div class="banner banner-mobile">
24 <swiper class="swiper" :options="swiperOption"> 24 <swiper class="swiper" :options="swiperOption">
25 <swiper-slide v-for="(item,index) in bannerList" :key="index"> 25 <swiper-slide v-for="(item,index) in bannerList" :key="index">
26 <img class="banner-img" :src="item.mobileBannerUrl"> 26 <img class="banner-img" :src="item.mobileBannerUrl">
27 <div class="btn-wrap"> 27 <div class="btn-wrap">
28 <div class="banner-btn" v-for="(btnItem, btnIndex) in item.btns" :key="btnIndex" @click="btnNavigateTo(btnItem.t,btnItem.l)" :style="{color:btnItem.c}">{{btnItem.n}}&nbsp;&gt;</div> 28 <div class="banner-btn" v-for="(btnItem, btnIndex) in item.btns" :key="btnIndex" @click="btnNavigateTo(btnItem.t,btnItem.l)" :style="{color:btnItem.c}">{{btnItem.n}}&nbsp;&gt;</div>
29 </div> 29 </div>
30 </swiper-slide> 30 </swiper-slide>
31 <div class="swiper-pagination" slot="pagination"></div> 31 <div class="swiper-pagination" slot="pagination"></div>
32 </swiper> 32 </swiper>
33 </div> 33 </div>
34 <!-- <div class="swiper-button-prev" slot="button-prev"></div> 34 <!-- <div class="swiper-button-prev" slot="button-prev"></div>
35 <div class="swiper-button-next" slot="button-next"></div> --> 35 <div class="swiper-button-next" slot="button-next"></div> -->
36 36
37 <div v-if="bannerTipsVisible" class="banner-tips"> 37 <div v-if="bannerTipsVisible" class="banner-tips">
38 <div class="cont"> 38 <div class="cont">
39 <div class="tit"> 39 <div class="tit">
40 <img class="icon" src="@/assets/images/vhis/hot-deal-icon.png"> {{$t('vhisDetail.bannerTips.t1')}} 40 <img class="icon" src="@/assets/images/vhis/hot-deal-icon.png"> {{$t('vhisDetail.bannerTips.t1')}}
41 </div> 41 </div>
42 <div class="desc"> 42 <div class="desc">
43 <div class="t1"> {{$t('vhisDetail.bannerTips.t2')}}</div> 43 <div class="t1"> {{$t('vhisDetail.bannerTips.t2')}}</div>
44 <div class="t2"> {{$t('vhisDetail.bannerTips.t3')}}</div> 44 <div class="t2"> {{$t('vhisDetail.bannerTips.t3')}}</div>
45 </div> 45 </div>
46 </div> 46 </div>
47 <img @click="onHideBannerTipsHandler" class="close" src="@/assets/images/vhis/close2.png"> 47 <img @click="onHideBannerTipsHandler" class="close" src="@/assets/images/vhis/close2.png">
48 </div> 48 </div>
49 </div> 49 </div>
50 <!-- 标题 --> 50 <!-- 标题 -->
51 <div class="title"> 51 <div class="title">
52 <div class="title-wrap"> 52 <div class="title-wrap">
53 <div class="tt t1">{{$t('vhisDetail.title.t1')}}</div> 53 <div class="tt t1">{{$t('vhisDetail.title.t1')}}</div>
54 <div class="tt t2"> 54 <div class="tt t2">
55 {{$t('vhisDetail.title.t2')}}{{$t('vhisDetail.title.t3')}} 55 {{$t('vhisDetail.title.t2')}}{{$t('vhisDetail.title.t3')}}
56 </div> 56 </div>
57 </div> 57 </div>
58 58
59 </div> 59 </div>
60 60
61 <div class="content"> 61 <div class="content">
62 62
63 <!-- 产品特点 --> 63 <!-- 产品特点 -->
64 <div class="box product"> 64 <div class="box product">
65 <div class="tit">{{$t('vhisDetail.main.t1')}}</div> 65 <div class="tit">{{$t('vhisDetail.main.t1')}}</div>
66 <div class="prod"> 66 <div class="prod">
67 <div v-for="(item,index) in productList" :key="item.id" class=" prod-item"> 67 <div v-for="(item,index) in productList" :key="item.id" class=" prod-item">
68 <div class="cont"> 68 <div class="cont">
69 <div class="icon-wrap"> 69 <div class="icon-wrap">
70 <img :src="require('@/assets/images/vhis/vhis-icon'+(index+1)+'.png')"> 70 <img :src="require('@/assets/images/vhis/vhis-icon'+(index+1)+'.png')">
71 </div> 71 </div>
72 <div class="detail"> 72 <div class="detail">
73 <div class="t1" v-html="item.title">{{item.title}}</div> 73 <div class="t1" v-html="item.title">{{item.title}}</div>
74 <div class="more pointer" @click="onShowMoreHandler(index)"> 74 <div class="more pointer" @click="onShowMoreHandler(index)">
75 <div class="more-icon-wrap"> 75 <div class="more-icon-wrap">
76 <img v-if="item.showMore" src="@/assets/images/vhis/vhis-mine.png"> 76 <img v-if="item.showMore" src="@/assets/images/vhis/vhis-mine.png">
77 <img v-else src="@/assets/images/vhis/vhis-plus.png"> 77 <img v-else src="@/assets/images/vhis/vhis-plus.png">
78 </div> 78 </div>
79 <div class="c1">{{item.showMore ? $t('vhisDetail.close') : $t('vhisDetail.expand')}}</div> 79 <div class="c1">{{item.showMore ? $t('vhisDetail.close') : $t('vhisDetail.expand')}}</div>
80 </div> 80 </div>
81 <div v-if="item.showMore" class="desc"> 81 <div v-if="item.showMore" class="desc">
82 {{item.desc}} 82 {{item.desc}}
83 <div class="tips">{{item.tips}}</div> 83 <div class="tips">{{item.tips}}</div>
84 </div> 84 </div>
85 </div> 85 </div>
86 </div> 86 </div>
87 </div> 87 </div>
88 </div> 88 </div>
89 </div> 89 </div>
90 90
91 <!-- 视频 --> 91 <!-- 视频 -->
92 <div class="box video"> 92 <div class="box video">
93 <video-player class="vjs-custom-skin" ref="videoPlayer" :options="playerOptions" :playsinline="true"> 93 <video-player class="vjs-custom-skin" ref="videoPlayer" :options="playerOptions" :playsinline="true">
94 </video-player> 94 </video-player>
95 </div> 95 </div>
96 96
97 <!-- 计划概览 --> 97 <!-- 计划概览 -->
98 <div class="guarantee"> 98 <div class="guarantee">
99 <div class="tit-wrap"> 99 <div class="tit-wrap">
100 <div class="tit">{{$t('vhisDetail.guarantee1.title')}}</div> 100 <div class="tit">{{$t('vhisDetail.guarantee1.title')}}</div>
101 <div class="tit-s"> 101 <div class="tit-s">
102 {{$t('vhisDetail.guarantee1.titleT1')}} 102 {{$t('vhisDetail.guarantee1.titleT1')}}
103 <span>{{$t('vhisDetail.guarantee1.titleNum')}}</span> 103 <span>{{$t('vhisDetail.guarantee1.titleNum')}}</span>
104 {{$t('vhisDetail.guarantee1.titleT2')}} 104 {{$t('vhisDetail.guarantee1.titleT2')}}
105 </div> 105 </div>
106 </div> 106 </div>
107 107
108 <div class="container"> 108 <div class="container">
109 <div class="table"> 109 <div class="table">
110 <div class="border2 table-border"></div> 110 <div class="border2 table-border"></div>
111 <div class="table-item"> 111 <div class="table-item">
112 <div class="tt label">{{$t('vhisDetail.guarantee1.k1')}}</div> 112 <div class="tt label">{{$t('vhisDetail.guarantee1.k1')}}</div>
113 <div class="tt val">{{$t('vhisDetail.guarantee1.v1')}}</div> 113 <div class="tt val">{{$t('vhisDetail.guarantee1.v1')}}</div>
114 </div> 114 </div>
115 <div class="table-item"> 115 <div class="table-item">
116 <div class="tt label">{{$t('vhisDetail.guarantee1.k2')}}</div> 116 <div class="tt label">{{$t('vhisDetail.guarantee1.k2')}}</div>
117 <div class="tt val">{{$t('vhisDetail.guarantee1.v2')}}</div> 117 <div class="tt val">{{$t('vhisDetail.guarantee1.v2')}}</div>
118 </div> 118 </div>
119 <div class="table-item"> 119 <div class="table-item">
120 <div class="tt label">{{$t('vhisDetail.guarantee1.k3')}}</div> 120 <div class="tt label">{{$t('vhisDetail.guarantee1.k3')}}</div>
121 <div class="tt val">{{$t('vhisDetail.guarantee1.v3')}}</div> 121 <div class="tt val">{{$t('vhisDetail.guarantee1.v3')}}</div>
122 </div> 122 </div>
123 <div class="table-item"> 123 <div class="table-item">
124 <div class="tt label">{{$t('vhisDetail.guarantee1.k4')}}</div> 124 <div class="tt label">{{$t('vhisDetail.guarantee1.k4')}}</div>
125 <div class="tt val">{{$t('vhisDetail.guarantee1.v4')}}</div> 125 <div class="tt val">{{$t('vhisDetail.guarantee1.v4')}}</div>
126 </div> 126 </div>
127 <div class="table-item"> 127 <div class="table-item">
128 <div class="tt label">{{$t('vhisDetail.guarantee1.k5')}}</div> 128 <div class="tt label">{{$t('vhisDetail.guarantee1.k5')}}</div>
129 <div class="tt val">{{$t('vhisDetail.guarantee1.v5')}}</div> 129 <div class="tt val">{{$t('vhisDetail.guarantee1.v5')}}</div>
130 </div> 130 </div>
131 </div> 131 </div>
132 </div> 132 </div>
133 133
134 </div> 134 </div>
135 135
136 <!-- 保障内容 --> 136 <!-- 保障内容 -->
137 <div class="guarantee guarantee2"> 137 <div class="guarantee guarantee2">
138 <div class="tit">{{$t('vhisDetail.guarantee2.title')}}</div> 138 <div class="tit">{{$t('vhisDetail.guarantee2.title')}}</div>
139 139
140 <div class="container"> 140 <div class="container">
141 <!-- 左表 --> 141 <!-- 左表 -->
142 <div class="table"> 142 <div class="table">
143 <div class="titl"> 143 <div class="titl">
144 <div class="titl-item">{{$t('vhisDetail.guarantee2.titK')}} 144 <div class="titl-item">{{$t('vhisDetail.guarantee2.titK')}}
145 <span class="small">(1)</span> 145 <span class="small">(1)</span>
146 </div> 146 </div>
147 <div class="titl-item">{{$t('vhisDetail.guarantee2.titV')}}</div> 147 <div class="titl-item">{{$t('vhisDetail.guarantee2.titV')}}</div>
148 </div> 148 </div>
149 <div class="border2 table-border"></div> 149 <div class="border2 table-border"></div>
150 <div class="table-item"> 150 <div class="table-item">
151 <div class="tt label"> 151 <div class="tt label">
152 <div class="fl"> 152 <div class="fl">
153 <div class="nn n1">(a)</div> 153 <div class="nn n1">(a)</div>
154 <div v-html="$t('vhisDetail.guarantee2.ak')" class="nn n2">{{$t('vhisDetail.guarantee2.ak')}}</div> 154 <div v-html="$t('vhisDetail.guarantee2.ak')" class="nn n2">{{$t('vhisDetail.guarantee2.ak')}}</div>
155 </div> 155 </div>
156 </div> 156 </div>
157 <div v-html="$t('vhisDetail.guarantee2.av')" class="tt val">{{$t('vhisDetail.guarantee2.av')}}</div> 157 <div v-html="$t('vhisDetail.guarantee2.av')" class="tt val">{{$t('vhisDetail.guarantee2.av')}}</div>
158 </div> 158 </div>
159 <div class="table-item"> 159 <div class="table-item">
160 <div class="tt label"> 160 <div class="tt label">
161 <div class="fl"> 161 <div class="fl">
162 <div class="nn n1">(b)</div> 162 <div class="nn n1">(b)</div>
163 <div v-html="$t('vhisDetail.guarantee2.bk')" class="nn n2">{{$t('vhisDetail.guarantee2.bk')}}</div> 163 <div v-html="$t('vhisDetail.guarantee2.bk')" class="nn n2">{{$t('vhisDetail.guarantee2.bk')}}</div>
164 </div> 164 </div>
165 </div> 165 </div>
166 <div v-html="$t('vhisDetail.guarantee2.bv')" class="tt val">{{$t('vhisDetail.guarantee2.bv')}}</div> 166 <div v-html="$t('vhisDetail.guarantee2.bv')" class="tt val">{{$t('vhisDetail.guarantee2.bv')}}</div>
167 </div> 167 </div>
168 <div class="table-item"> 168 <div class="table-item">
169 <div class="tt label"> 169 <div class="tt label">
170 <div class="fl"> 170 <div class="fl">
171 <div class="nn n1">(c)</div> 171 <div class="nn n1">(c)</div>
172 <div v-html="$t('vhisDetail.guarantee2.ck')" class="nn n2">{{$t('vhisDetail.guarantee2.ck')}}</div> 172 <div v-html="$t('vhisDetail.guarantee2.ck')" class="nn n2">{{$t('vhisDetail.guarantee2.ck')}}</div>
173 </div> 173 </div>
174 </div> 174 </div>
175 <div v-html="$t('vhisDetail.guarantee2.cv')" class="tt val">{{$t('vhisDetail.guarantee2.cv')}}</div> 175 <div v-html="$t('vhisDetail.guarantee2.cv')" class="tt val">{{$t('vhisDetail.guarantee2.cv')}}</div>
176 </div> 176 </div>
177 <div class="table-item"> 177 <div class="table-item">
178 <div class="tt label"> 178 <div class="tt label">
179 <div class="fl"> 179 <div class="fl">
180 <div class="nn n1">(d)</div> 180 <div class="nn n1">(d)</div>
181 <div class="nn n2"> 181 <div class="nn n2">
182 <span v-html="$t('vhisDetail.guarantee2.dk')">{{$t('vhisDetail.guarantee2.dk')}}</span> 182 <span v-html="$t('vhisDetail.guarantee2.dk')">{{$t('vhisDetail.guarantee2.dk')}}</span>
183 <span class="small">(2)</span> 183 <span class="small">(2)</span>
184 </div> 184 </div>
185 </div> 185 </div>
186 </div> 186 </div>
187 <div v-html="$t('vhisDetail.guarantee2.dv')" class="tt val">{{$t('vhisDetail.guarantee2.dv')}}</div> 187 <div v-html="$t('vhisDetail.guarantee2.dv')" class="tt val">{{$t('vhisDetail.guarantee2.dv')}}</div>
188 </div> 188 </div>
189 <div class="table-item"> 189 <div class="table-item">
190 <div class="tt label"> 190 <div class="tt label">
191 <div class="fl"> 191 <div class="fl">
192 <div class="nn n1">(e)</div> 192 <div class="nn n1">(e)</div>
193 <div v-html="$t('vhisDetail.guarantee2.ek')" class="nn n2">{{$t('vhisDetail.guarantee2.ek')}}</div> 193 <div v-html="$t('vhisDetail.guarantee2.ek')" class="nn n2">{{$t('vhisDetail.guarantee2.ek')}}</div>
194 </div> 194 </div>
195 </div> 195 </div>
196 <div v-html="$t('vhisDetail.guarantee2.ev')" class="tt val">{{$t('vhisDetail.guarantee2.ev')}}</div> 196 <div v-html="$t('vhisDetail.guarantee2.ev')" class="tt val">{{$t('vhisDetail.guarantee2.ev')}}</div>
197 </div> 197 </div>
198 <!-- 4分 --> 198 <!-- 4分 -->
199 <div class="table-item table-item-4"> 199 <div class="table-item table-item-4">
200 <div class="tt label label2"> 200 <div class="tt label label2">
201 <div class="fl"> 201 <div class="fl">
202 <div class="nn n1">(f)</div> 202 <div class="nn n1">(f)</div>
203 <div v-html="$t('vhisDetail.guarantee2.fk')" class="nn n2">{{$t('vhisDetail.guarantee2.fk')}}</div> 203 <div v-html="$t('vhisDetail.guarantee2.fk')" class="nn n2">{{$t('vhisDetail.guarantee2.fk')}}</div>
204 </div> 204 </div>
205 </div> 205 </div>
206 <div class="tt val"> 206 <div class="tt val">
207 <div class="val-item"> 207 <div class="val-item">
208 {{$t('vhisDetail.guarantee2.fv0')}} 208 {{$t('vhisDetail.guarantee2.fv0')}}
209 </div> 209 </div>
210 <div class="val-item"> 210 <div class="val-item">
211 {{$t('vhisDetail.guarantee2.fv1')}} 211 {{$t('vhisDetail.guarantee2.fv1')}}
212 </div> 212 </div>
213 <div class="val-item"> 213 <div class="val-item">
214 {{$t('vhisDetail.guarantee2.fv2')}} 214 {{$t('vhisDetail.guarantee2.fv2')}}
215 </div> 215 </div>
216 <div class="val-item"> 216 <div class="val-item">
217 {{$t('vhisDetail.guarantee2.fv3')}} 217 {{$t('vhisDetail.guarantee2.fv3')}}
218 </div> 218 </div>
219 <div class="val-item"> 219 <div class="val-item">
220 {{$t('vhisDetail.guarantee2.fv4')}} 220 {{$t('vhisDetail.guarantee2.fv4')}}
221 </div> 221 </div>
222 </div> 222 </div>
223 </div> 223 </div>
224 </div> 224 </div>
225 225
226 <!-- 右表 --> 226 <!-- 右表 -->
227 <div class="table"> 227 <div class="table">
228 <div class="titl"> 228 <div class="titl">
229 <div class="titl-item">{{$t('vhisDetail.guarantee2.titK')}} 229 <div class="titl-item">{{$t('vhisDetail.guarantee2.titK')}}
230 <span class="small">(1)</span> 230 <span class="small">(1)</span>
231 </div> 231 </div>
232 <div class="titl-item">{{$t('vhisDetail.guarantee2.titV')}}</div> 232 <div class="titl-item">{{$t('vhisDetail.guarantee2.titV')}}</div>
233 </div> 233 </div>
234 <div class="border2 table-border"></div> 234 <div class="border2 table-border"></div>
235 <div class="table-item"> 235 <div class="table-item">
236 <div class="tt label"> 236 <div class="tt label">
237 <div class="fl"> 237 <div class="fl">
238 <div class="nn n1">(g)</div> 238 <div class="nn n1">(g)</div>
239 <div v-html="$t('vhisDetail.guarantee2.gk')" class="nn n2">{{$t('vhisDetail.guarantee2.gk')}}</div> 239 <div v-html="$t('vhisDetail.guarantee2.gk')" class="nn n2">{{$t('vhisDetail.guarantee2.gk')}}</div>
240 </div> 240 </div>
241 </div> 241 </div>
242 <div class="tt val"> 242 <div class="tt val">
243 <div> 243 <div>
244 <span v-html="$t('vhisDetail.guarantee2.gv')">{{$t('vhisDetail.guarantee2.gv')}}</span> 244 <span v-html="$t('vhisDetail.guarantee2.gv')">{{$t('vhisDetail.guarantee2.gv')}}</span>
245 <span class="small">(5)</span> 245 <span class="small">(5)</span>
246 </div> 246 </div>
247 </div> 247 </div>
248 </div> 248 </div>
249 <div class="table-item"> 249 <div class="table-item">
250 <div class="tt label"> 250 <div class="tt label">
251 <div class="fl"> 251 <div class="fl">
252 <div class="nn n1">(h)</div> 252 <div class="nn n1">(h)</div>
253 <div v-html="$t('vhisDetail.guarantee2.hk')" class="nn n2">{{$t('vhisDetail.guarantee2.hk')}}</div> 253 <div v-html="$t('vhisDetail.guarantee2.hk')" class="nn n2">{{$t('vhisDetail.guarantee2.hk')}}</div>
254 </div> 254 </div>
255 </div> 255 </div>
256 <div class="tt val"> 256 <div class="tt val">
257 <div> 257 <div>
258 <span v-html="$t('vhisDetail.guarantee2.hv')">{{$t('vhisDetail.guarantee2.hv')}}</span> 258 <span v-html="$t('vhisDetail.guarantee2.hv')">{{$t('vhisDetail.guarantee2.hv')}}</span>
259 <span class="small">(5)</span> 259 <span class="small">(5)</span>
260 </div> 260 </div>
261 </div> 261 </div>
262 </div> 262 </div>
263 <div class="table-item"> 263 <div class="table-item">
264 <div class="tt label "> 264 <div class="tt label ">
265 <div class="fl"> 265 <div class="fl">
266 <div class="nn n1">(i)</div> 266 <div class="nn n1">(i)</div>
267 <div class="nn n2"> 267 <div class="nn n2">
268 <span v-html="$t('vhisDetail.guarantee2.ik')">{{$t('vhisDetail.guarantee2.ik')}}</span> 268 <span v-html="$t('vhisDetail.guarantee2.ik')">{{$t('vhisDetail.guarantee2.ik')}}</span>
269 <span class="small">(2)(3)</span> 269 <span class="small">(2)(3)</span>
270 </div> 270 </div>
271 </div> 271 </div>
272 </div> 272 </div>
273 <div v-html="$t('vhisDetail.guarantee2.iv')" class="tt val">{{$t('vhisDetail.guarantee2.iv')}}</div> 273 <div v-html="$t('vhisDetail.guarantee2.iv')" class="tt val">{{$t('vhisDetail.guarantee2.iv')}}</div>
274 </div> 274 </div>
275 <div class="table-item"> 275 <div class="table-item">
276 <div class="tt label "> 276 <div class="tt label ">
277 <div class="fl"> 277 <div class="fl">
278 <div class="nn n1">(j)</div> 278 <div class="nn n1">(j)</div>
279 <div class="nn n2"> 279 <div class="nn n2">
280 <span v-html="$t('vhisDetail.guarantee2.jk')">{{$t('vhisDetail.guarantee2.jk')}}</span> 280 <span v-html="$t('vhisDetail.guarantee2.jk')">{{$t('vhisDetail.guarantee2.jk')}}</span>
281 <span class="small">(4)</span> 281 <span class="small">(4)</span>
282 </div> 282 </div>
283 </div> 283 </div>
284 </div> 284 </div>
285 <div v-html="$t('vhisDetail.guarantee2.jv')" class="tt val">{{$t('vhisDetail.guarantee2.jv')}}</div> 285 <div v-html="$t('vhisDetail.guarantee2.jv')" class="tt val">{{$t('vhisDetail.guarantee2.jv')}}</div>
286 </div> 286 </div>
287 <div class="table-item table-item-3"> 287 <div class="table-item table-item-3">
288 <div class="tt label label2"> 288 <div class="tt label label2">
289 <div class="fl"> 289 <div class="fl">
290 <div class="nn n1">(k)</div> 290 <div class="nn n1">(k)</div>
291 <div class="nn n2"> 291 <div class="nn n2">
292 <span v-html="$t('vhisDetail.guarantee2.kk')">{{$t('vhisDetail.guarantee2.kk')}}</span> 292 <span v-html="$t('vhisDetail.guarantee2.kk')">{{$t('vhisDetail.guarantee2.kk')}}</span>
293 <span class="small">(2)</span> 293 <span class="small">(2)</span>
294 </div> 294 </div>
295 </div> 295 </div>
296 </div> 296 </div>
297 <div class="tt val"> 297 <div class="tt val">
298 <div class="val-item val-item-thr"> 298 <div class="val-item val-item-thr">
299 <div v-html="$t('vhisDetail.guarantee2.kv11')" class="thr">{{$t('vhisDetail.guarantee2.kv11')}}</div> 299 <div v-html="$t('vhisDetail.guarantee2.kv11')" class="thr">{{$t('vhisDetail.guarantee2.kv11')}}</div>
300 <div v-html="$t('vhisDetail.guarantee2.kv12')" class="thr">{{$t('vhisDetail.guarantee2.kv12')}}</div> 300 <div v-html="$t('vhisDetail.guarantee2.kv12')" class="thr">{{$t('vhisDetail.guarantee2.kv12')}}</div>
301 </div> 301 </div>
302 <div v-html="$t('vhisDetail.guarantee2.kv2')" class="val-item"> 302 <div v-html="$t('vhisDetail.guarantee2.kv2')" class="val-item">
303 {{$t('vhisDetail.guarantee2.kv2')}} 303 {{$t('vhisDetail.guarantee2.kv2')}}
304 </div> 304 </div>
305 <div v-html="$t('vhisDetail.guarantee2.kv3')" class="val-item"> 305 <div v-html="$t('vhisDetail.guarantee2.kv3')" class="val-item">
306 {{$t('vhisDetail.guarantee2.kv3')}} 306 {{$t('vhisDetail.guarantee2.kv3')}}
307 </div> 307 </div>
308 </div> 308 </div>
309 </div> 309 </div>
310 <!-- 4分 --> 310 <!-- 4分 -->
311 <div class="table-item table-item"> 311 <div class="table-item table-item">
312 <div class="tt label"> 312 <div class="tt label">
313 <div class="fl"> 313 <div class="fl">
314 <div class="nn n1">(l)</div> 314 <div class="nn n1">(l)</div>
315 <div v-html="$t('vhisDetail.guarantee2.lk')" class="nn n2">{{$t('vhisDetail.guarantee2.lk')}}</div> 315 <div v-html="$t('vhisDetail.guarantee2.lk')" class="nn n2">{{$t('vhisDetail.guarantee2.lk')}}</div>
316 </div> 316 </div>
317 </div> 317 </div>
318 <div v-html="$t('vhisDetail.guarantee2.lv')" class="tt val">{{$t('vhisDetail.guarantee2.lv')}}</div> 318 <div v-html="$t('vhisDetail.guarantee2.lv')" class="tt val">{{$t('vhisDetail.guarantee2.lv')}}</div>
319 </div> 319 </div>
320 </div> 320 </div>
321 </div> 321 </div>
322 322
323 </div> 323 </div>
324 324
325 <!-- 其他限额 --> 325 <!-- 其他限额 -->
326 <div class="guarantee"> 326 <div class="guarantee">
327 <div class="tit">{{$t('vhisDetail.guarantee3.title')}}</div> 327 <div class="tit">{{$t('vhisDetail.guarantee3.title')}}</div>
328 328
329 <div class="container"> 329 <div class="container">
330 <div class="table"> 330 <div class="table">
331 <div class="border2 table-border"></div> 331 <div class="border2 table-border"></div>
332 <div class="table-item"> 332 <div class="table-item">
333 <div class="tt label">{{$t('vhisDetail.guarantee3.k1')}}</div> 333 <div class="tt label">{{$t('vhisDetail.guarantee3.k1')}}</div>
334 <div class="tt val">{{$t('vhisDetail.guarantee3.v1')}}</div> 334 <div class="tt val">{{$t('vhisDetail.guarantee3.v1')}}</div>
335 </div> 335 </div>
336 <div class="table-item"> 336 <div class="table-item">
337 <div class="tt label">{{$t('vhisDetail.guarantee3.k2')}}</div> 337 <div class="tt label">{{$t('vhisDetail.guarantee3.k2')}}</div>
338 <div class="tt val">{{$t('vhisDetail.guarantee3.v2')}}</div> 338 <div class="tt val">{{$t('vhisDetail.guarantee3.v2')}}</div>
339 </div> 339 </div>
340 </div> 340 </div>
341 </div> 341 </div>
342 </div> 342 </div>
343 343
344 <!-- 其他保障 --> 344 <!-- 其他保障 -->
345 <div class="guarantee"> 345 <div class="guarantee">
346 <div class="tit">{{$t('vhisDetail.guarantee4.title')}}</div> 346 <div class="tit">{{$t('vhisDetail.guarantee4.title')}}</div>
347 347
348 <div class="container"> 348 <div class="container">
349 <div class="table"> 349 <div class="table">
350 <div class="border2 table-border"></div> 350 <div class="border2 table-border"></div>
351 <div class="table-item"> 351 <div class="table-item">
352 <div class="tt label">{{$t('vhisDetail.guarantee4.k1')}}</div> 352 <div class="tt label">{{$t('vhisDetail.guarantee4.k1')}}</div>
353 <div class="tt val">{{$t('vhisDetail.guarantee4.v1')}}</div> 353 <div class="tt val">{{$t('vhisDetail.guarantee4.v1')}}</div>
354 </div> 354 </div>
355 <div class="table-item"> 355 <div class="table-item">
356 <div class="tt label">{{$t('vhisDetail.guarantee4.k2')}}</div> 356 <div class="tt label">{{$t('vhisDetail.guarantee4.k2')}}</div>
357 <div class="tt val">{{$t('vhisDetail.guarantee4.v2')}}</div> 357 <div class="tt val">{{$t('vhisDetail.guarantee4.v2')}}</div>
358 </div> 358 </div>
359 </div> 359 </div>
360 </div> 360 </div>
361 </div> 361 </div>
362 362
363 <!-- 下载 --> 363 <!-- 下载 -->
364 <div class="download"> 364 <div class="download">
365 <div class="border2 download-item"> 365 <div class="border2 download-item">
366 <div class="cont" @click="downloadFile('file1')"> 366 <div class="cont" @click="downloadFile('file1')">
367 <div class="icon-wrap"><img class="icon" src="@/assets/images/vhis/vhis-download.png"></div> {{$t('vhisDetail.download.t1')}} 367 <div class="icon-wrap"><img class="icon" src="@/assets/images/vhis/vhis-download.png"></div>
368 </div> 368 <div class="desc">{{$t('vhisDetail.download.t1')}}</div>
369 </div> 369 </div>
370 <div class="border2 download-item"> 370 </div>
371 <div class="cont" @click="downloadFile('file2')"> 371 <div class="border2 download-item">
372 <div class="icon-wrap"><img class="icon" src="@/assets/images/vhis/vhis-download.png"></div> {{$t('vhisDetail.download.t2')}} 372 <div class="cont" @click="downloadFile('file2')">
373 </div> 373 <div class="icon-wrap"><img class="icon" src="@/assets/images/vhis/vhis-download.png"></div>
374 </div> 374 <div class="desc">{{$t('vhisDetail.download.t2')}}</div>
375 <div class="border2 download-item"> 375 </div>
376 <div class="cont" @click="downloadFile('file3')"> 376 </div>
377 <div class="icon-wrap"><img class="icon" src="@/assets/images/vhis/vhis-download.png"></div> {{$t('vhisDetail.download.t3')}} 377 <div class="border2 download-item">
378 </div> 378 <div class="cont" @click="downloadFile('file3')">
379 </div> 379 <div class="icon-wrap"><img class="icon" src="@/assets/images/vhis/vhis-download.png"></div>
380 </div> 380 <div class="desc">{{$t('vhisDetail.download.t3')}}</div>
381 </div>
382 </div>
383 </div>
381 384
382 <!-- 立即投保 --> 385 <!-- 立即投保 -->
383 <div class="submit-btn" @click="bottomBtnHandle()"> 386 <div class="btn-wrap">
384 {{$t('vhisDetail.submitBtn')}} 387 <div class="submit-btn" @click="bottomBtnHandle()">
385 </div> 388 {{$t('vhisDetail.submitBtn')}}
389 </div>
390 </div>
386 391
387 </div> 392 </div>
388 </div> 393 </div>
389 394
390 </template> 395 </template>
391 396
......