Merge branch 'master' of http://120.27.44.69/dev/pingan-life-index-pro
# Conflicts: # src/pages/vhis-detail/vhis-detail.vue
Showing
22 changed files
with
90 additions
and
83 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 | ||
| ... | @@ -645,16 +645,34 @@ $borderSize: 6px; | ... | @@ -645,16 +645,34 @@ $borderSize: 6px; |
| 645 | .enCont { | 645 | .enCont { |
| 646 | padding-left: 76px !important; | 646 | padding-left: 76px !important; |
| 647 | } | 647 | } |
| 648 | |||
| 649 | .desc{ | ||
| 650 | flex: 1; | ||
| 651 | text-align: left; | ||
| 652 | } | ||
| 648 | } | 653 | } |
| 649 | } | 654 | } |
| 650 | 655 | ||
| 651 | // 提交订单 | 656 | |
| 652 | .submit-btn { | 657 | // 立即投保 |
| 658 | .btn-wrap { | ||
| 653 | margin: 50px auto 100px; | 659 | margin: 50px auto 100px; |
| 654 | @extend .pointer; | 660 | display: flex; |
| 661 | justify-content: center; | ||
| 662 | |||
| 663 | .submit-btn { | ||
| 664 | @extend .fcc; | ||
| 655 | @extend .bb; | 665 | @extend .bb; |
| 656 | @include btc4(300px, 50px, 22px); | 666 | @include btc4(300px, 50px, 22px); |
| 667 | line-height: normal; | ||
| 668 | min-width: 300px; | ||
| 669 | min-height: 50px; | ||
| 670 | height: auto; | ||
| 671 | width: auto; | ||
| 657 | font-weight: bold; | 672 | font-weight: bold; |
| 673 | // display: inline-block; | ||
| 674 | padding: 4px 20px; | ||
| 675 | } | ||
| 658 | } | 676 | } |
| 659 | 677 | ||
| 660 | 678 | ||
| ... | @@ -900,6 +918,7 @@ $borderSize: 6px; | ... | @@ -900,6 +918,7 @@ $borderSize: 6px; |
| 900 | } | 918 | } |
| 901 | 919 | ||
| 902 | .icon-wrap { | 920 | .icon-wrap { |
| 921 | // width: 34%; | ||
| 903 | width: 40%; | 922 | width: 40%; |
| 904 | display: flex; | 923 | display: flex; |
| 905 | justify-content: flex-end; | 924 | justify-content: flex-end; | ... | ... |
| ... | @@ -142,7 +142,6 @@ | ... | @@ -142,7 +142,6 @@ |
| 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> --> | ||
| 146 | </div> | 145 | </div> |
| 147 | <div class="titl-item">{{$t('vhisDetail.guarantee2.titV')}}</div> | 146 | <div class="titl-item">{{$t('vhisDetail.guarantee2.titV')}}</div> |
| 148 | </div> | 147 | </div> |
| ... | @@ -180,7 +179,6 @@ | ... | @@ -180,7 +179,6 @@ |
| 180 | <div class="nn n1">(d)</div> | 179 | <div class="nn n1">(d)</div> |
| 181 | <div class="nn n2"> | 180 | <div class="nn n2"> |
| 182 | <span v-html="$t('vhisDetail.guarantee2.dk')">{{$t('vhisDetail.guarantee2.dk')}}</span> | 181 | <span v-html="$t('vhisDetail.guarantee2.dk')">{{$t('vhisDetail.guarantee2.dk')}}</span> |
| 183 | <!-- <span class="small">(2)</span> --> | ||
| 184 | </div> | 182 | </div> |
| 185 | </div> | 183 | </div> |
| 186 | </div> | 184 | </div> |
| ... | @@ -227,7 +225,6 @@ | ... | @@ -227,7 +225,6 @@ |
| 227 | <div class="table"> | 225 | <div class="table"> |
| 228 | <div class="titl"> | 226 | <div class="titl"> |
| 229 | <div class="titl-item">{{$t('vhisDetail.guarantee2.titK')}} | 227 | <div class="titl-item">{{$t('vhisDetail.guarantee2.titK')}} |
| 230 | <!-- <span class="small">(1)</span> --> | ||
| 231 | </div> | 228 | </div> |
| 232 | <div class="titl-item">{{$t('vhisDetail.guarantee2.titV')}}</div> | 229 | <div class="titl-item">{{$t('vhisDetail.guarantee2.titV')}}</div> |
| 233 | </div> | 230 | </div> |
| ... | @@ -242,7 +239,6 @@ | ... | @@ -242,7 +239,6 @@ |
| 242 | <div class="tt val"> | 239 | <div class="tt val"> |
| 243 | <div> | 240 | <div> |
| 244 | <span v-html="$t('vhisDetail.guarantee2.gv')">{{$t('vhisDetail.guarantee2.gv')}}</span> | 241 | <span v-html="$t('vhisDetail.guarantee2.gv')">{{$t('vhisDetail.guarantee2.gv')}}</span> |
| 245 | <!-- <span class="small">(5)</span> --> | ||
| 246 | </div> | 242 | </div> |
| 247 | </div> | 243 | </div> |
| 248 | </div> | 244 | </div> |
| ... | @@ -256,7 +252,6 @@ | ... | @@ -256,7 +252,6 @@ |
| 256 | <div class="tt val"> | 252 | <div class="tt val"> |
| 257 | <div> | 253 | <div> |
| 258 | <span v-html="$t('vhisDetail.guarantee2.hv')">{{$t('vhisDetail.guarantee2.hv')}}</span> | 254 | <span v-html="$t('vhisDetail.guarantee2.hv')">{{$t('vhisDetail.guarantee2.hv')}}</span> |
| 259 | <!-- <span class="small">(5)</span> --> | ||
| 260 | </div> | 255 | </div> |
| 261 | </div> | 256 | </div> |
| 262 | </div> | 257 | </div> |
| ... | @@ -266,7 +261,6 @@ | ... | @@ -266,7 +261,6 @@ |
| 266 | <div class="nn n1">(i)</div> | 261 | <div class="nn n1">(i)</div> |
| 267 | <div class="nn n2"> | 262 | <div class="nn n2"> |
| 268 | <span v-html="$t('vhisDetail.guarantee2.ik')">{{$t('vhisDetail.guarantee2.ik')}}</span> | 263 | <span v-html="$t('vhisDetail.guarantee2.ik')">{{$t('vhisDetail.guarantee2.ik')}}</span> |
| 269 | <!-- <span class="small">(2)(3)</span> --> | ||
| 270 | </div> | 264 | </div> |
| 271 | </div> | 265 | </div> |
| 272 | </div> | 266 | </div> |
| ... | @@ -278,7 +272,6 @@ | ... | @@ -278,7 +272,6 @@ |
| 278 | <div class="nn n1">(j)</div> | 272 | <div class="nn n1">(j)</div> |
| 279 | <div class="nn n2"> | 273 | <div class="nn n2"> |
| 280 | <span v-html="$t('vhisDetail.guarantee2.jk')">{{$t('vhisDetail.guarantee2.jk')}}</span> | 274 | <span v-html="$t('vhisDetail.guarantee2.jk')">{{$t('vhisDetail.guarantee2.jk')}}</span> |
| 281 | <!-- <span class="small">(4)</span> --> | ||
| 282 | </div> | 275 | </div> |
| 283 | </div> | 276 | </div> |
| 284 | </div> | 277 | </div> |
| ... | @@ -290,7 +283,7 @@ | ... | @@ -290,7 +283,7 @@ |
| 290 | <div class="nn n1">(k)</div> | 283 | <div class="nn n1">(k)</div> |
| 291 | <div class="nn n2"> | 284 | <div class="nn n2"> |
| 292 | <span v-html="$t('vhisDetail.guarantee2.kk')">{{$t('vhisDetail.guarantee2.kk')}}</span> | 285 | <span v-html="$t('vhisDetail.guarantee2.kk')">{{$t('vhisDetail.guarantee2.kk')}}</span> |
| 293 | <!-- <span class="small">(2)</span> --> | 286 | |
| 294 | </div> | 287 | </div> |
| 295 | </div> | 288 | </div> |
| 296 | </div> | 289 | </div> |
| ... | @@ -364,25 +357,30 @@ | ... | @@ -364,25 +357,30 @@ |
| 364 | <div class="download"> | 357 | <div class="download"> |
| 365 | <div class="border2 download-item"> | 358 | <div class="border2 download-item"> |
| 366 | <div :class="{enCont : locale == 'en'}" class="cont" @click="downloadFile('file1')"> | 359 | <div :class="{enCont : locale == 'en'}" 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')}} | 360 | <div class="icon-wrap"><img class="icon" src="@/assets/images/vhis/vhis-download.png"></div> |
| 361 | <div class="desc">{{$t('vhisDetail.download.t1')}}</div> | ||
| 368 | </div> | 362 | </div> |
| 369 | </div> | 363 | </div> |
| 370 | <div class="border2 download-item"> | 364 | <div class="border2 download-item"> |
| 371 | <div :class="{enCont : locale == 'en'}" class="cont" @click="downloadFile('file2')"> | 365 | <div :class="{enCont : locale == 'en'}" 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')}} | 366 | <div class="icon-wrap"><img class="icon" src="@/assets/images/vhis/vhis-download.png"></div> |
| 367 | <div class="desc">{{$t('vhisDetail.download.t2')}}</div> | ||
| 373 | </div> | 368 | </div> |
| 374 | </div> | 369 | </div> |
| 375 | <div class="border2 download-item"> | 370 | <div class="border2 download-item"> |
| 376 | <div :class="{enCont : locale == 'en'}" class="cont" @click="downloadFile('file3')"> | 371 | <div :class="{enCont : locale == 'en'}" 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')}} | 372 | <div class="icon-wrap"><img class="icon" src="@/assets/images/vhis/vhis-download.png"></div> |
| 373 | <div class="desc">{{$t('vhisDetail.download.t3')}}</div> | ||
| 378 | </div> | 374 | </div> |
| 379 | </div> | 375 | </div> |
| 380 | </div> | 376 | </div> |
| 381 | 377 | ||
| 382 | <!-- 立即投保 --> | 378 | <!-- 立即投保 --> |
| 379 | <div class="btn-wrap"> | ||
| 383 | <div class="submit-btn" @click="bottomBtnHandle()"> | 380 | <div class="submit-btn" @click="bottomBtnHandle()"> |
| 384 | {{$t('vhisDetail.submitBtn')}} | 381 | {{$t('vhisDetail.submitBtn')}} |
| 385 | </div> | 382 | </div> |
| 383 | </div> | ||
| 386 | 384 | ||
| 387 | </div> | 385 | </div> |
| 388 | </div> | 386 | </div> | ... | ... |
-
Please register or sign in to post a comment