#46 #23 修复
Showing
21 changed files
with
88 additions
and
75 deletions
src/assets/images/index/index-tab-1.png
0 → 100644
865 Bytes
src/assets/images/index/index-tab-2.png
0 → 100644
865 Bytes
src/assets/images/index/index-tab-3.png
0 → 100644
823 Bytes
src/assets/images/index/index-tab-4.png
0 → 100644
780 Bytes
src/assets/images/index/index-tab-5.png
0 → 100644
767 Bytes
src/assets/images/index/index-tab-act-1.png
0 → 100644
26.8 KB
src/assets/images/index/index-tab-act-2.png
0 → 100644
26.8 KB
src/assets/images/index/index-tab-act-3.png
0 → 100644
18.8 KB
src/assets/images/index/index-tab-act-4.png
0 → 100644
14.5 KB
src/assets/images/index/index-tab-act-5.png
0 → 100644
12 KB
14.2 KB
13.3 KB
1.65 KB
796 Bytes
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; |
705 | justify-content: center; | ||
706 | |||
707 | .submit-btn { | ||
708 | @extend .fcc; | ||
721 | @extend .bb; | 709 | @extend .bb; |
722 | @include btc4(300px, 50px, 22px); | 710 | @include btc4(300px, 50px, 22px); |
711 | line-height: normal; | ||
712 | min-width: 300px; | ||
713 | min-height: 50px; | ||
714 | height: auto; | ||
715 | width: auto; | ||
723 | font-weight: bold; | 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 | } | ... | ... |
... | @@ -194,7 +194,8 @@ | ... | @@ -194,7 +194,8 @@ |
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 | |||
198 | </div> | 199 | </div> |
199 | </div> | 200 | </div> |
200 | <div class="border2 download-item"> | 201 | <div class="border2 download-item"> |
... | @@ -202,15 +203,18 @@ | ... | @@ -202,15 +203,18 @@ |
202 | <div class="icon-wrap"> | 203 | <div class="icon-wrap"> |
203 | <img class="icon" src="@/assets/images/vhis/vhis-download.png" /> | 204 | <img class="icon" src="@/assets/images/vhis/vhis-download.png" /> |
204 | </div> | 205 | </div> |
205 | {{$t('genRich.download.t2')}} | 206 | <div class="desc">{{$t('genRich.download.t2')}}</div> |
207 | |||
206 | </div> | 208 | </div> |
207 | </div> | 209 | </div> |
208 | </div> | 210 | </div> |
209 | 211 | ||
210 | <!-- 立即投保 --> | 212 | <!-- 立即投保 --> |
213 | <div class="btn-wrap"> | ||
211 | <div class="submit-btn" @click="bottomBtnHandle()">{{$t('genRich.submitBtn')}}</div> | 214 | <div class="submit-btn" @click="bottomBtnHandle()">{{$t('genRich.submitBtn')}}</div> |
212 | </div> | 215 | </div> |
213 | </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; |
658 | justify-content: center; | ||
659 | |||
660 | .submit-btn { | ||
661 | @extend .fcc; | ||
652 | @extend .bb; | 662 | @extend .bb; |
653 | @include btc4(300px, 50px, 22px); | 663 | @include btc4(300px, 50px, 22px); |
664 | line-height: normal; | ||
665 | min-width: 300px; | ||
666 | min-height: 50px; | ||
667 | height: auto; | ||
668 | width: auto; | ||
654 | font-weight: bold; | 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; | ... | ... |
... | @@ -364,25 +364,30 @@ | ... | @@ -364,25 +364,30 @@ |
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 class="desc">{{$t('vhisDetail.download.t1')}}</div> | ||
368 | </div> | 369 | </div> |
369 | </div> | 370 | </div> |
370 | <div class="border2 download-item"> | 371 | <div class="border2 download-item"> |
371 | <div class="cont" @click="downloadFile('file2')"> | 372 | <div class="cont" @click="downloadFile('file2')"> |
372 | <div class="icon-wrap"><img class="icon" src="@/assets/images/vhis/vhis-download.png"></div> {{$t('vhisDetail.download.t2')}} | 373 | <div class="icon-wrap"><img class="icon" src="@/assets/images/vhis/vhis-download.png"></div> |
374 | <div class="desc">{{$t('vhisDetail.download.t2')}}</div> | ||
373 | </div> | 375 | </div> |
374 | </div> | 376 | </div> |
375 | <div class="border2 download-item"> | 377 | <div class="border2 download-item"> |
376 | <div class="cont" @click="downloadFile('file3')"> | 378 | <div class="cont" @click="downloadFile('file3')"> |
377 | <div class="icon-wrap"><img class="icon" src="@/assets/images/vhis/vhis-download.png"></div> {{$t('vhisDetail.download.t3')}} | 379 | <div class="icon-wrap"><img class="icon" src="@/assets/images/vhis/vhis-download.png"></div> |
380 | <div class="desc">{{$t('vhisDetail.download.t3')}}</div> | ||
378 | </div> | 381 | </div> |
379 | </div> | 382 | </div> |
380 | </div> | 383 | </div> |
381 | 384 | ||
382 | <!-- 立即投保 --> | 385 | <!-- 立即投保 --> |
386 | <div class="btn-wrap"> | ||
383 | <div class="submit-btn" @click="bottomBtnHandle()"> | 387 | <div class="submit-btn" @click="bottomBtnHandle()"> |
384 | {{$t('vhisDetail.submitBtn')}} | 388 | {{$t('vhisDetail.submitBtn')}} |
385 | </div> | 389 | </div> |
390 | </div> | ||
386 | 391 | ||
387 | </div> | 392 | </div> |
388 | </div> | 393 | </div> | ... | ... |
-
Please register or sign in to post a comment