Commit ea9edcf4 authored by 郭志伟's avatar 郭志伟

Merge branch 'master' into feature/goods

parents fe64a9e5 73c40489
This diff is collapsed.
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
"version": "0.1.0", "version": "0.1.0",
"private": true, "private": true,
"scripts": { "scripts": {
"serve": "vue-cli-service serve", "serve": "vue-cli-service serve --open",
"build": "vue-cli-service build", "build": "vue-cli-service build",
"release": "vue-cli-service build", "release": "vue-cli-service build",
"lint": "vue-cli-service lint" "lint": "vue-cli-service lint"
......
...@@ -3,10 +3,9 @@ ...@@ -3,10 +3,9 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1 ,user-scalable=no">
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> <link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title> <title><%= htmlWebpackPlugin.options.title %></title>
<script crossorigin="anonymous" integrity="sha384-OZmxTjkv7EQo5XDMPAmIkkvywVeXw59YyYh6zq8UKfkbor13jS+5p8qMTBSA1q+F" src="https://lib.baomitu.com/vue/2.6.11/vue.min.js"></script>
</head> </head>
<body> <body>
<noscript> <noscript>
......
<?xml version="1.0" encoding="UTF-8"?>
<svg width="40px" height="40px" viewBox="0 0 40 40" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>Group 6</title>
<desc>Created with Sketch.</desc>
<g id="我的" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="我的-未登录" transform="translate(-36.000000, -262.000000)">
<g id="Group-7" transform="translate(36.000000, 262.000000)">
<g id="Group-6">
<g id="Group-25">
<circle id="Oval-Copy-4" fill="#FFF0CB" fill-rule="nonzero" cx="20" cy="20" r="20"></circle>
<g id="Group-26" transform="translate(12.000000, 12.000000)" fill="#FF6702" fill-rule="nonzero">
<rect id="Rectangle" x="0" y="7" width="16" height="2" rx="1"></rect>
<rect id="Rectangle" transform="translate(8.000000, 8.000000) rotate(90.000000) translate(-8.000000, -8.000000) " x="0" y="7" width="16" height="2" rx="1"></rect>
</g>
<g id="Group-5" transform="translate(12.000000, 12.000000)"></g>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="27px" height="27px" viewBox="0 0 27 27" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>Group 2</title>
<desc>Created with Sketch.</desc>
<g id="我的" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="我的-未登录" transform="translate(-48.000000, -140.000000)">
<g id="Group-2" transform="translate(48.000000, 140.000000)">
<g id="Group-16">
<rect id="Rectangle" opacity="0.1" fill-rule="nonzero" x="0" y="0" width="27" height="27" rx="8"></rect>
<g id="Group-15" transform="translate(6.000000, 4.000000)">
<g id="Group-12" fill="#333333">
<rect id="Rectangle" x="0" y="1" width="15" height="17" rx="3"></rect>
<rect id="Rectangle" stroke="#FFC842" stroke-linecap="round" stroke-linejoin="round" x="3.5" y="-0.5" width="8" height="3" rx="1.5"></rect>
</g>
<rect id="Rectangle" fill="#FFFFFF" fill-rule="nonzero" x="4" y="7" width="7" height="1" rx="0.5"></rect>
<rect id="Rectangle-Copy-5" fill="#FFFFFF" fill-rule="nonzero" x="4" y="11" width="7" height="1" rx="0.5"></rect>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>我的-未登录</title>
<desc>Created with Sketch.</desc>
<g id="我的" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="我的-未登录" transform="translate(-324.000000, -754.000000)">
<g id="Group-30" transform="translate(324.000000, 754.000000)">
<g id="右向箭头">
<g id="Group-14" transform="translate(8.000000, 8.000000) rotate(-90.000000) translate(-8.000000, -8.000000) ">
<rect id="Rectangle" fill-rule="nonzero" x="0" y="0" width="16" height="16"></rect>
<path d="M8.70710678,5.70710678 L13.2928932,10.2928932 C13.6834175,10.6834175 13.6834175,11.3165825 13.2928932,11.7071068 C13.1053568,11.8946432 12.8510029,12 12.5857864,12 L3.41421356,12 C2.86192881,12 2.41421356,11.5522847 2.41421356,11 C2.41421356,10.7347835 2.5195704,10.4804296 2.70710678,10.2928932 L7.29289322,5.70710678 C7.68341751,5.31658249 8.31658249,5.31658249 8.70710678,5.70710678 Z" id="Triangle" fill="#EEEEEE" fill-rule="nonzero" transform="translate(8.000000, 8.500000) scale(1, -1) translate(-8.000000, -8.500000) "></path>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>Group 14</title>
<desc>Created with Sketch.</desc>
<g id="我的" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="我的-" transform="translate(-329.000000, -71.000000)">
<g id="Group-23" transform="translate(329.000000, 71.000000)">
<g id="Group">
<g id="编组-3" transform="translate(0.000000, 0.000000)">
<g id="编组-2备份" fill="#FFC842" fill-rule="nonzero" stroke="#FFFFFF">
<rect id="矩形-copy备份" x="0.5" y="0.5" width="19" height="19" rx="9.5"></rect>
</g>
<g id="v" transform="translate(6.000000, 6.000000)"></g>
</g>
<polygon id="路径" fill="#000000" fill-rule="nonzero" points="8.03035182 14 6.64573643 6.668 6 6.668 6 6.004 8.57907128 6.004 9.27137897 9.856 11.7751938 6 15 6.0032 9.96368667 13.9999969"></polygon>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="27px" height="27px" viewBox="0 0 27 27" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>Group 2</title>
<desc>Created with Sketch.</desc>
<g id="我的" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="我的-未登录" transform="translate(-228.000000, -140.000000)">
<g id="Group-3" transform="translate(228.000000, 140.000000)">
<g id="Group-9">
<g id="Group-11">
<rect id="Rectangle-Copy" fill="#000000" fill-rule="nonzero" opacity="0" x="0" y="0" width="27" height="27" rx="8"></rect>
<g id="Group-8" transform="translate(5.000000, 4.000000)">
<g id="盾牌" fill="#333333">
<path d="M0,2.96129676 C7.49191124,2.96129676 8.6615961,0 8.6615961,0 C8.6615961,0 9.80690735,2.96129676 17.3258892,2.96129676 L17.3258892,13.3983551 C17.3258892,18.1945383 8.6615961,20 8.6615961,20 C8.6615961,20 0,18.1945383 0,13.3983551 L0,2.96129676 Z" id="Path"></path>
</g>
<path d="M11.1034462,10.7741548 C11.4095999,10.7741548 11.6597488,11.0342089 11.6597488,11.3524682 C11.6597488,11.6707417 11.4095999,11.9307816 11.1034462,11.9307816 L9.38549326,11.9307816 L9.38549326,13.4216866 C9.38549326,13.7399459 9.13533076,14 8.82917704,14 C8.52225355,13.9991954 8.27363474,13.7407461 8.27286084,13.4216866 L8.27286084,11.9307816 L6.55630255,11.9307816 C6.2493845,11.9299691 6.0007739,11.671522 6,11.3524682 C6,11.0342089 6.25014883,10.7741548 6.55630255,10.7741548 L8.27425549,10.7741548 L8.27425549,9.91978256 L6.55630255,9.91978256 C6.2493845,9.9189701 6.0007739,9.66052298 6,9.34146914 C6,9.02320985 6.25014882,8.76268667 6.55630255,8.76268667 L7.79074837,8.76268667 L6.29729357,6.95204417 C6.09940322,6.70944874 6.12647864,6.34641057 6.35797466,6.1384227 C6.59115381,5.93155915 6.94137174,5.95976911 7.14111342,6.20150319 L8.83058536,8.24790858 L10.520071,6.20150319 C10.720309,5.96078824 11.0696915,5.93264508 11.3032098,6.13842272 C11.5346948,6.34558761 11.5617675,6.71092273 11.3638772,6.95204419 L9.87039502,8.76267248 L11.1053057,8.76267248 C11.4114731,8.76267248 11.661622,9.02320988 11.661622,9.34146917 C11.661622,9.65925941 11.4114731,9.91978259 11.1053057,9.91978259 L9.38549325,9.91978259 L9.38549325,10.7736715 L11.1034462,10.7736715 L11.1034462,10.7741548 Z" id="Path" fill="#FFFFFF"></path>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>编组 5备份</title>
<desc>Created with Sketch.</desc>
<g id="规范" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="规范2" transform="translate(-283.000000, -1567.000000)">
<g id="编组-11备份-6" transform="translate(58.000000, 1561.000000)">
<g id="编组-6备份" transform="translate(225.000000, 6.000000)">
<path d="M18.2,0 C21.049,0 22.4541333,0 23.9555556,0.466666667 C25.6193,1.07963333 26.9203667,2.3807 27.5333333,4.04444444 C28,5.54563333 28,6.95123333 28,9.8 L28,18.2 C28,21.049 28,22.4541333 27.5333333,23.9555556 C26.9203667,25.6193 25.6193,26.9203667 23.9555556,27.5333333 C22.4541333,28 21.049,28 18.2,28 L9.8,28 C6.951,28 5.54563333,28 4.04444444,27.5333333 C2.3807,26.9203667 1.07963333,25.6193 0.466666667,23.9555556 C0,22.4541333 0,21.049 0,18.2 L0,9.8 C0,6.95123333 0,5.54563333 0.466666667,4.04444444 C1.07963333,2.3807 2.3807,1.07963333 4.04444444,0.466666667 C5.54563333,0 6.951,0 9.8,0 L18.2,0 Z" id="Icon-Shape-备份-6"></path>
<path d="M9,5.75 C7.20507456,5.75 5.75,7.20507456 5.75,9 L5.75,16.2307692 C5.75,18.0256947 7.20507456,19.4807692 9,19.4807692 L13.3696326,19.4807692 L16.3210477,21.8163618 C16.42618,21.8995579 16.5782228,21.8850134 16.6656755,21.7833944 L18.6473024,19.4807692 L19,19.4807692 C20.7949254,19.4807692 22.25,18.0256947 22.25,16.2307692 L22.25,9 C22.25,7.20507456 20.7949254,5.75 19,5.75 L9,5.75 Z" id="矩形备份-10" stroke="#000000" stroke-width="1.5" fill="#FFC841"></path>
<rect id="矩形备份-4" stroke="#000000" x="11.5" y="12.5" width="6" height="1" rx="0.5"></rect>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>编组 5备份</title>
<desc>Created with Sketch.</desc>
<g id="规范" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="规范2" transform="translate(-283.000000, -1403.000000)">
<g id="编组-11备份-4" transform="translate(58.000000, 1397.000000)">
<g id="编组-6备份" transform="translate(225.000000, 6.000000)">
<path d="M18.2,0 C21.049,0 22.4541333,0 23.9555556,0.466666667 C25.6193,1.07963333 26.9203667,2.3807 27.5333333,4.04444444 C28,5.54563333 28,6.95123333 28,9.8 L28,18.2 C28,21.049 28,22.4541333 27.5333333,23.9555556 C26.9203667,25.6193 25.6193,26.9203667 23.9555556,27.5333333 C22.4541333,28 21.049,28 18.2,28 L9.8,28 C6.951,28 5.54563333,28 4.04444444,27.5333333 C2.3807,26.9203667 1.07963333,25.6193 0.466666667,23.9555556 C0,22.4541333 0,21.049 0,18.2 L0,9.8 C0,6.95123333 0,5.54563333 0.466666667,4.04444444 C1.07963333,2.3807 2.3807,1.07963333 4.04444444,0.466666667 C5.54563333,0 6.951,0 9.8,0 L18.2,0 Z" id="Icon-Shape-备份-6"></path>
<path d="M9,5.75 C7.20507456,5.75 5.75,7.20507456 5.75,9 L5.75,16.2307692 C5.75,18.0256947 7.20507456,19.4807692 9,19.4807692 L13.3696326,19.4807692 L16.3210477,21.8163618 C16.42618,21.8995579 16.5782228,21.8850134 16.6656755,21.7833944 L18.6473024,19.4807692 L19,19.4807692 C20.7949254,19.4807692 22.25,18.0256947 22.25,16.2307692 L22.25,9 C22.25,7.20507456 20.7949254,5.75 19,5.75 L9,5.75 Z" id="矩形备份-10" stroke="#000000" stroke-width="1.5"></path>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>Group 6</title>
<desc>Created with Sketch.</desc>
<g id="我的" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="保单详情-已开通续保" transform="translate(-80.000000, -1063.000000)" fill-rule="nonzero">
<g id="Group-6" transform="translate(80.000000, 1060.000000)">
<g id="Group-5" transform="translate(0.000000, 2.000000)">
<g id="Group-3">
<rect id="Rectangle" x="0" y="0" width="16" height="16"></rect>
<path d="M13.9636348,10.3999957 C13.9636348,10.801657 13.631512,11.1272699 13.2218165,11.1272699 C12.8121227,11.1272699 12.4799982,10.8016587 12.4799982,10.3999957 L12.4787618,9.33260122 C12.4775255,8.75878233 12.4762891,8.31320678 12.4753,8.29502437 C12.3645218,5.81574288 10.2965814,3.85454159 7.78181933,3.85454159 C5.27076056,3.85454159 3.20480981,5.80993038 3.08858204,8.28534254 C3.08784021,8.3042516 3.08610932,8.75128232 3.08512022,9.32704099 L3.08363659,10.4000128 C3.08363659,10.8016741 2.75151379,11.127287 2.3418183,11.127287 C1.93212454,11.127287 1.6,10.8016758 1.6,10.4000128 L1.60148365,9.32413302 C1.60272001,8.62449636 1.60395637,8.27322319 1.60667636,8.21867767 C1.75874905,4.96994637 4.47453786,2.4 7.78182204,2.4 C11.0940439,2.4 13.8120525,4.97720774 13.9574545,8.23152996 C13.9599273,8.28365127 13.9611636,8.63250091 13.9624,9.32995575 L13.9636364,10.4000179 L13.9636348,10.3999957 Z M3.08363773,9.67272153 L3.08363774,11.8545424 L3.08363773,11.8544312 C3.0836378,12.2560925 3.41576054,12.5817054 3.82545603,12.5817054 C4.23506112,12.5817053 4.56714741,12.2562288 4.56727433,11.8546545 L4.56727433,10.4001078 C4.56727433,9.9984465 4.23515152,9.6728336 3.82545603,9.6728336 L3.08363773,9.6728336 L3.08363773,9.67272153 Z M1.60000279,8.21817484 L3.82545604,8.21817484 C5.05453895,8.21817479 6.0509091,9.19500844 6.0509091,10.3999957 L6.0509091,11.8545424 C6.0509091,13.059528 5.05453895,14.0363633 3.82545594,14.0363633 C2.59637294,14.0363633 1.60000279,13.059528 1.60000279,11.8545424 L1.60000279,8.21817484 Z M12.48,9.67272153 L12.4799999,11.8545424 L12.48,11.8544311 C12.48,12.2560924 12.1478771,12.5817053 11.7381817,12.5817053 C11.3285766,12.5817053 10.9964885,12.2562287 10.9963634,11.8546544 L10.9963634,10.4001077 C10.9963634,9.99844628 11.3284862,9.67283338 11.7381817,9.67283338 L12.48,9.67283338 L12.48,9.67272153 Z M13.9636348,8.21817484 L11.7381816,8.21817484 C10.5090985,8.21817489 9.5127284,9.19501014 9.5127284,10.3999957 C9.5127284,10.3999957 9.5127284,10.3999957 9.5127284,10.3999957 L9.5127284,11.8545424 L9.5127284,11.8545427 C9.51272858,13.0595283 10.5090985,14.0363636 11.7381815,14.0363636 C12.9672646,14.0363635 13.9636347,13.0595283 13.9636347,11.8545427 L13.9636348,8.21817484 Z" id="Shape" fill="#999999"></path>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>我的-未登录</title>
<desc>Created with Sketch.</desc>
<g id="我的" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="我的-未登录" transform="translate(-36.000000, -808.000000)" fill-rule="nonzero">
<g id="Group-13-Copy-3" transform="translate(36.000000, 808.000000)">
<g id="Group-17">
<g id="Group-18">
<path d="M6,0 L16,0 C18.209139,-4.05812251e-16 20,1.790861 20,4 L20,14 C20,17.3137085 17.3137085,20 14,20 L4,20 C1.790861,20 2.705415e-16,18.209139 0,16 L0,6 C-4.05812251e-16,2.6862915 2.6862915,6.08718376e-16 6,0 Z" id="矩形备份-copy-9" fill="#FFC842" transform="translate(10.000000, 10.000000) scale(1, -1) translate(-10.000000, -10.000000) "></path>
<path d="M10.7998555,11.9700621 L11.1142702,11.7975671 C11.2371026,11.7317357 11.3388523,11.6825704 11.4396853,11.642572 C12.1537629,11.3550798 12.7825922,11.5584078 13.6139963,12.4175502 C14.1291601,12.9492014 14.2813248,13.4216878 14.0824094,13.8425091 C13.9348271,14.1558331 13.649745,14.3724934 13.1419159,14.6408201 C13.1089161,14.6574863 12.8165008,14.8074823 12.7413361,14.8491471 C11.5597606,15.493295 8.85193934,14.018338 6.90405055,11.4967437 C4.95156951,8.96931658 4.44556766,6.27438937 5.64272618,5.62025296 L5.80130844,5.5319222 L5.97272356,5.43359169 C6.57771988,5.08693468 6.96546718,4.94860615 7.42471345,5.01693768 C7.88395972,5.08693571 8.27445754,5.3869275 8.60445524,5.93357825 C9.30111777,7.0902119 9.14711777,7.63853399 8.25154139,8.13684482 C8.1873752,8.17351042 7.95821081,8.29517376 7.93712673,8.30767291 C7.7171288,8.42766945 8.08929241,9.23264673 8.95370334,10.3509539 C9.82819726,11.4817543 10.5596916,12.1009083 10.7989351,11.9700722 L10.7998555,11.9700621 Z" id="Path" fill="#333333"></path>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>Group 6</title>
<desc>Created with Sketch.</desc>
<g id="我的" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="保单详情-已开通续保" transform="translate(-212.000000, -1062.000000)">
<g id="Group-6" transform="translate(80.000000, 1060.000000)">
<g id="Group-5-Copy" transform="translate(132.000000, 2.000000)">
<g id="Group-3">
<rect id="Rectangle" fill-rule="nonzero" x="0" y="0" width="16" height="16"></rect>
<path d="M3.82078079,4.76015437 C3.15534898,5.16965087 2.75,5.89504898 2.75,6.67638558 L2.75,12 C2.75,13.2426407 3.75735931,14.25 5,14.25 L12,14.25 C13.2426407,14.25 14.25,13.2426407 14.25,12 L14.25,6.67638558 C14.25,5.89504898 13.844651,5.16965087 13.1792192,4.76015437 L9.67921921,2.60630822 C8.9560535,2.16128317 8.0439465,2.16128317 7.32078079,2.60630822 L3.82078079,4.76015437 Z" id="矩形备份-3" stroke="#999999" stroke-width="1.5"></path>
<path d="M8.5,13.8 L8.5,10.2810245" id="Path-3" stroke="#979797" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill-rule="nonzero"></path>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>我的-未登录</title>
<desc>Created with Sketch.</desc>
<g id="我的" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="我的-未登录" transform="translate(-36.000000, -751.000000)" fill-rule="nonzero">
<g id="Group-13-Copy-2" transform="translate(36.000000, 751.000000)">
<g id="Group-17">
<path d="M6,0 L16,0 C18.209139,-4.05812251e-16 20,1.790861 20,4 L20,14 C20,17.3137085 17.3137085,20 14,20 L4,20 C1.790861,20 2.705415e-16,18.209139 0,16 L0,6 C-4.05812251e-16,2.6862915 2.6862915,6.08718376e-16 6,0 Z" id="矩形备份-copy-9" fill="#FFC842" transform="translate(10.000000, 10.000000) scale(1, -1) translate(-10.000000, -10.000000) "></path>
<g id="Group-13" transform="translate(7.000000, 5.000000)" fill="#333333">
<path d="M2.11365337,9.26672 C2.11365337,8.67097099 2.58699332,8.18947399 3.17050677,8.18947399 C3.75402022,8.18947399 4.22734236,8.67097099 4.22734236,9.26672 C4.22734236,9.86246901 3.75400241,10.343966 3.17048896,10.343966 C2.58699332,10.343966 2.11365337,9.86042084 2.11365337,9.26672 Z M5.60244506,4.29468248 C5.40250849,4.49666721 5.0413902,4.8373929 4.52113835,5.31481138 C4.37830107,5.449456 4.26201869,5.56778653 4.17633414,5.66980298 C4.09064958,5.77181943 4.02535762,5.86566104 3.98250644,5.94931524 C3.93967306,6.03296944 3.90702709,6.118654 3.88458632,6.20435637 C3.86214555,6.29002312 3.82745141,6.43896927 3.7805217,6.65115922 C3.70096383,7.10407095 3.44797086,7.32851427 3.02563914,7.32851427 C2.80530996,7.32851427 2.62168747,7.25506527 2.47071095,7.10611911 C2.31973444,6.95719077 2.24628545,6.73887413 2.24628545,6.44714413 C2.24628545,6.0819295 2.30137219,5.76569275 2.41154569,5.49841606 C2.52171918,5.23115717 2.66656901,4.99652646 2.84814333,4.79455953 C3.02973547,4.59255698 3.27455358,4.35179958 3.58263329,4.0743533 C3.8539707,3.83156554 4.04779839,3.64794305 4.16817709,3.52348583 C4.28853799,3.39902861 4.39055444,3.26233582 4.47216048,3.10931114 C4.55378432,2.95630428 4.5966177,2.7930922 4.5966177,2.61354823 C4.5966177,2.26671367 4.47013012,1.97291768 4.21918532,1.73420845 C3.96824052,1.49549921 3.64382892,1.37512051 3.24598612,1.37512051 C2.78082102,1.37512051 2.43806498,1.49551702 2.21976615,1.7362388 C1.99941917,1.9769962 1.81374851,2.33198781 1.662772,2.80124924 C1.51995253,3.29293363 1.24656696,3.53776956 0.844645644,3.53776956 C0.607984573,3.53776956 0.408030189,3.452085 0.244818113,3.28069807 C0.0816060378,3.10931114 0,2.9236583 0,2.72372172 C0,2.31159521 0.128517933,1.893342 0.385589419,1.46897992 C0.642660905,1.04461784 1.02011109,0.69370475 1.51384365,0.41622285 C2.00757621,0.13874095 2.58494516,-5.68434189e-14 3.24395577,-5.68434189e-14 C3.85601886,-5.68434189e-14 4.39871148,0.11630018 4.86592475,0.348900541 C5.33518618,0.581483091 5.69833483,0.897719845 5.95337596,1.29759299 C6.20839928,1.69748395 6.33693502,2.13205124 6.33693502,2.60129486 C6.34101354,2.970588 6.26961271,3.2949818 6.12271472,3.57449405 C5.97581673,3.85197595 5.80444761,4.09271555 5.60244506,4.29468248 Z" id="Shape"></path>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>编组 5备份</title>
<desc>Created with Sketch.</desc>
<g id="规范" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="规范2" transform="translate(-85.000000, -1403.000000)">
<g id="编组-11备份-4" transform="translate(58.000000, 1397.000000)">
<g id="编组-5备份" transform="translate(27.000000, 6.000000)">
<path d="M18.2,0 C21.049,0 22.4541333,0 23.9555556,0.466666667 C25.6193,1.07963333 26.9203667,2.3807 27.5333333,4.04444444 C28,5.54563333 28,6.95123333 28,9.8 L28,18.2 C28,21.049 28,22.4541333 27.5333333,23.9555556 C26.9203667,25.6193 25.6193,26.9203667 23.9555556,27.5333333 C22.4541333,28 21.049,28 18.2,28 L9.8,28 C6.951,28 5.54563333,28 4.04444444,27.5333333 C2.3807,26.9203667 1.07963333,25.6193 0.466666667,23.9555556 C0,22.4541333 0,21.049 0,18.2 L0,9.8 C0,6.95123333 0,5.54563333 0.466666667,4.04444444 C1.07963333,2.3807 2.3807,1.07963333 4.04444444,0.466666667 C5.54563333,0 6.951,0 9.8,0 L18.2,0 Z" id="Icon-Shape-备份-4"></path>
<g id="编组-13" transform="translate(5.000000, 4.000000)" stroke="#000000">
<path d="M1.82078079,5.29861591 C1.15534898,5.70811241 0.75,6.43351052 0.75,7.21484712 L0.75,16.3846154 C0.75,17.6272561 1.75735931,18.6346154 3,18.6346154 L15,18.6346154 C16.2426407,18.6346154 17.25,17.6272561 17.25,16.3846154 L17.25,7.21484712 C17.25,6.43351052 16.844651,5.70811241 16.1792192,5.29861591 L10.1792192,1.60630822 C9.4560535,1.16128317 8.5439465,1.16128317 7.82078079,1.60630822 L1.82078079,5.29861591 Z" id="矩形备份-3" stroke-width="1.5" fill="#FFC841"></path>
<rect id="矩形备份-4" x="6.5" y="13.5" width="6" height="1" rx="0.5"></rect>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>编组 5备份</title>
<desc>Created with Sketch.</desc>
<g id="规范" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="规范2" transform="translate(-85.000000, -1485.000000)">
<g id="编组-11备份-5" transform="translate(58.000000, 1479.000000)">
<g id="编组-5备份" transform="translate(27.000000, 6.000000)">
<path d="M18.2,0 C21.049,0 22.4541333,0 23.9555556,0.466666667 C25.6193,1.07963333 26.9203667,2.3807 27.5333333,4.04444444 C28,5.54563333 28,6.95123333 28,9.8 L28,18.2 C28,21.049 28,22.4541333 27.5333333,23.9555556 C26.9203667,25.6193 25.6193,26.9203667 23.9555556,27.5333333 C22.4541333,28 21.049,28 18.2,28 L9.8,28 C6.951,28 5.54563333,28 4.04444444,27.5333333 C2.3807,26.9203667 1.07963333,25.6193 0.466666667,23.9555556 C0,22.4541333 0,21.049 0,18.2 L0,9.8 C0,6.95123333 0,5.54563333 0.466666667,4.04444444 C1.07963333,2.3807 2.3807,1.07963333 4.04444444,0.466666667 C5.54563333,0 6.951,0 9.8,0 L18.2,0 Z" id="Icon-Shape-备份-4"></path>
<g id="编组-13" transform="translate(5.000000, 4.000000)" stroke="#000000" stroke-width="1.5">
<path d="M1.82078079,5.29861591 C1.15534898,5.70811241 0.75,6.43351052 0.75,7.21484712 L0.75,16.3846154 C0.75,17.6272561 1.75735931,18.6346154 3,18.6346154 L15,18.6346154 C16.2426407,18.6346154 17.25,17.6272561 17.25,16.3846154 L17.25,7.21484712 C17.25,6.43351052 16.844651,5.70811241 16.1792192,5.29861591 L10.1792192,1.60630822 C9.4560535,1.16128317 8.5439465,1.16128317 7.82078079,1.60630822 L1.82078079,5.29861591 Z" id="矩形备份-3"></path>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
This diff is collapsed.
<?xml version="1.0" encoding="UTF-8"?>
<svg width="12px" height="12px" viewBox="0 0 12 12" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>Group 14</title>
<desc>Created with Sketch.</desc>
<g id="我的" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="保单详情-已开通续保" transform="translate(-77.000000, -81.000000)" fill-rule="nonzero">
<g id="Group" transform="translate(20.000000, 77.000000)">
<g id="Group-14" transform="translate(63.000000, 10.000000) rotate(-90.000000) translate(-63.000000, -10.000000) translate(57.000000, 4.000000)">
<rect id="Rectangle" x="0" y="0" width="12" height="12"></rect>
<path d="M7.24329415,4.82588238 L9.49793174,7.33103527 C9.86739076,7.74154529 9.83411235,8.37383513 9.42360233,8.74329415 C9.23997762,8.90855638 9.00167937,9 8.7546376,9 L4.2453624,9 C3.69307765,9 3.2453624,8.55228475 3.2453624,8 C3.2453624,7.75295822 3.33680602,7.51465998 3.50206826,7.33103527 L5.75670585,4.82588238 C6.12616487,4.41537236 6.75845471,4.38209395 7.16896473,4.75155297 C7.19502719,4.77500918 7.21983793,4.79981992 7.24329415,4.82588238 Z" id="Triangle" fill="#FFFFFF" transform="translate(6.500000, 6.500000) scale(1, -1) translate(-6.500000, -6.500000) "></path>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>编组 5备份</title>
<desc>Created with Sketch.</desc>
<g id="规范" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="规范2" transform="translate(-184.000000, -1485.000000)">
<g id="编组-11备份-5" transform="translate(58.000000, 1479.000000)">
<g id="编组备份-2" transform="translate(126.000000, 6.000000)">
<path d="M18.2,0 C21.049,0 22.4541333,0 23.9555556,0.466666667 C25.6193,1.07963333 26.9203667,2.3807 27.5333333,4.04444444 C28,5.54563333 28,6.95123333 28,9.8 L28,18.2 C28,21.049 28,22.4541333 27.5333333,23.9555556 C26.9203667,25.6193 25.6193,26.9203667 23.9555556,27.5333333 C22.4541333,28 21.049,28 18.2,28 L9.8,28 C6.951,28 5.54563333,28 4.04444444,27.5333333 C2.3807,26.9203667 1.07963333,25.6193 0.466666667,23.9555556 C0,22.4541333 0,21.049 0,18.2 L0,9.8 C0,6.95123333 0,5.54563333 0.466666667,4.04444444 C1.07963333,2.3807 2.3807,1.07963333 4.04444444,0.466666667 C5.54563333,0 6.951,0 9.8,0 L18.2,0 Z" id="Icon-Shape-备份-5"></path>
<g id="编组-15" transform="translate(5.000000, 4.000000)" stroke="#000000" stroke-width="1.5">
<path d="M3.02605117,17.0160459 L7.7777771,18.9445433 C8.5615431,19.2626363 9.43844501,19.262631 10.2222071,18.9445284 L14.9742706,17.0158261 C16.3977808,16.0434938 17.25,14.4362235 17.25,12.7176355 L17.25,2.78649268 C17.2499806,2.67295716 17.169713,2.57346295 17.0551677,2.54814198 L9.26971899,0.827697191 C9.09204917,0.788435341 8.90794979,0.7884352 8.73027991,0.827696777 L0.944841432,2.54812675 C0.830256744,2.57347673 0.750000028,2.67298015 0.750000015,2.78635037 L0.749999994,12.7184474 C0.750403915,14.4371009 1.60267341,16.043964 3.02605117,17.0160459 Z" id="路径" fill="#FFC841"></path>
<rect id="矩形备份-4" x="6.75" y="10.15" width="4.5" height="1" rx="0.5"></rect>
<path d="M6.75,10.15 L11.25,10.15 L6.75,10.15 Z" id="矩形备份-4" transform="translate(9.000000, 10.150000) scale(-1, 1) rotate(90.000000) translate(-9.000000, -10.150000) "></path>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>编组 5备份</title>
<desc>Created with Sketch.</desc>
<g id="规范" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="规范2" transform="translate(-184.000000, -1403.000000)">
<g id="编组-11备份-4" transform="translate(58.000000, 1397.000000)">
<g id="编组备份-2" transform="translate(126.000000, 6.000000)">
<path d="M18.2,0 C21.049,0 22.4541333,0 23.9555556,0.466666667 C25.6193,1.07963333 26.9203667,2.3807 27.5333333,4.04444444 C28,5.54563333 28,6.95123333 28,9.8 L28,18.2 C28,21.049 28,22.4541333 27.5333333,23.9555556 C26.9203667,25.6193 25.6193,26.9203667 23.9555556,27.5333333 C22.4541333,28 21.049,28 18.2,28 L9.8,28 C6.951,28 5.54563333,28 4.04444444,27.5333333 C2.3807,26.9203667 1.07963333,25.6193 0.466666667,23.9555556 C0,22.4541333 0,21.049 0,18.2 L0,9.8 C0,6.95123333 0,5.54563333 0.466666667,4.04444444 C1.07963333,2.3807 2.3807,1.07963333 4.04444444,0.466666667 C5.54563333,0 6.951,0 9.8,0 L18.2,0 Z" id="Icon-Shape-备份-5"></path>
<path d="M8.02605117,21.0160459 L12.7777771,22.9445433 C13.5615431,23.2626363 14.438445,23.262631 15.2222071,22.9445284 L19.9742706,21.0158261 C21.3977808,20.0434938 22.25,18.4362235 22.25,16.7176355 L22.25,6.78649268 C22.2499806,6.67295716 22.169713,6.57346295 22.0551677,6.54814198 L14.269719,4.82769719 C14.0920492,4.78843534 13.9079498,4.7884352 13.7302799,4.82769678 L5.94484143,6.54812675 C5.83025674,6.57347673 5.75000003,6.67298015 5.75000001,6.78635037 L5.74999999,16.7184474 C5.75040392,18.4371009 6.60267341,20.043964 8.02605117,21.0160459 Z" id="路径" stroke="#000000" stroke-width="1.5"></path>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>编组 5备份</title>
<desc>Created with Sketch.</desc>
<g id="规范" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="规范2" transform="translate(-379.000000, -1649.000000)">
<g id="编组-11备份-7" transform="translate(58.000000, 1567.000000)">
<g id="编组-7备份" transform="translate(321.000000, 82.000000)">
<path d="M18.2,0 C21.049,0 22.4541333,0 23.9555556,0.466666667 C25.6193,1.07963333 26.9203667,2.3807 27.5333333,4.04444444 C28,5.54563333 28,6.95123333 28,9.8 L28,18.2 C28,21.049 28,22.4541333 27.5333333,23.9555556 C26.9203667,25.6193 25.6193,26.9203667 23.9555556,27.5333333 C22.4541333,28 21.049,28 18.2,28 L9.8,28 C6.951,28 5.54563333,28 4.04444444,27.5333333 C2.3807,26.9203667 1.07963333,25.6193 0.466666667,23.9555556 C0,22.4541333 0,21.049 0,18.2 L0,9.8 C0,6.95123333 0,5.54563333 0.466666667,4.04444444 C1.07963333,2.3807 2.3807,1.07963333 4.04444444,0.466666667 C5.54563333,0 6.951,0 9.8,0 L18.2,0 Z" id="Icon-Shape-备份-8"></path>
<g id="编组-4备份" transform="translate(5.000000, 5.000000)" stroke="#000000" stroke-width="1.5">
<circle id="Oval-备份" fill="#FFC842" cx="9" cy="9" r="8.25"></circle>
<g id="编组-11" transform="translate(6.000000, 7.000000)" stroke-linecap="round" stroke-linejoin="round">
<path d="M0.5,0 L0.5,2" id="路径-11"></path>
<path d="M6,0 L6,2" id="路径-11"></path>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.2 (67145) - http://www.bohemiancoding.com/sketch -->
<title>编组 5备份</title>
<desc>Created with Sketch.</desc>
<g id="规范" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="规范2" transform="translate(-379.000000, -1403.000000)">
<g id="编组-11备份-4" transform="translate(58.000000, 1397.000000)">
<g id="编组-7备份" transform="translate(321.000000, 6.000000)">
<path d="M18.2,0 C21.049,0 22.4541333,0 23.9555556,0.466666667 C25.6193,1.07963333 26.9203667,2.3807 27.5333333,4.04444444 C28,5.54563333 28,6.95123333 28,9.8 L28,18.2 C28,21.049 28,22.4541333 27.5333333,23.9555556 C26.9203667,25.6193 25.6193,26.9203667 23.9555556,27.5333333 C22.4541333,28 21.049,28 18.2,28 L9.8,28 C6.951,28 5.54563333,28 4.04444444,27.5333333 C2.3807,26.9203667 1.07963333,25.6193 0.466666667,23.9555556 C0,22.4541333 0,21.049 0,18.2 L0,9.8 C0,6.95123333 0,5.54563333 0.466666667,4.04444444 C1.07963333,2.3807 2.3807,1.07963333 4.04444444,0.466666667 C5.54563333,0 6.951,0 9.8,0 L18.2,0 Z" id="Icon-Shape-备份-8"></path>
<g id="编组-4备份" transform="translate(5.000000, 5.000000)" stroke="#000000" stroke-width="1.5">
<circle id="Oval-备份" cx="9" cy="9" r="8.25"></circle>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<template>
<cr-overlay class="user-mask" :show="value" @click="hide">
<cr-image class="user-mask-image" round width="86px" height="86px" fit="cover" :src="record" />
<p class="user-mask-title">平台备案中</p>
<p class="user-mask-desc">{{ desc }}</p>
</cr-overlay>
</template>
<script>
import record from "@/assets/images/user/for_the_record@2x.png";
export default {
name: "Tabbar",
props: {
value: {
type: Boolean,
default: false
},
desc: {
type: String,
default: ""
}
},
data() {
return {
record
};
},
methods: {
hide() {
this.$emit("input", false);
}
}
};
</script>
<style lang="less">
.user-mask {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
z-index: 101;
&-image {
margin-bottom: 10px;
}
&-title {
font-size: 15px;
line-height: 24px;
font-weight: 600;
color: #ffffff;
}
&-desc {
font-size: 20px;
line-height: 24px;
font-weight: 600;
color: #ffffff;
}
}
</style>
<template> <template>
<svg :class="svgClass" aria-hidden="true"> <svg :class="[className, 'svg-icon']" aria-hidden="true">
<use :xlink:href="iconName" /> <use :xlink:href="iconName" />
</svg> </svg>
</template> </template>
...@@ -9,24 +9,17 @@ export default { ...@@ -9,24 +9,17 @@ export default {
name: "SvgIcon", name: "SvgIcon",
props: { props: {
iconClass: { iconClass: {
type: String, type: [String, Array],
required: true required: true
}, },
className: { className: {
type: String, type: [String, Array],
default: "" default: ""
} }
}, },
computed: { computed: {
iconName() { iconName() {
return `#icon-${this.iconClass}`; return `#icon-${this.iconClass}`;
},
svgClass() {
if (this.className) {
return "svg-icon " + this.className;
} else {
return "svg-icon";
}
} }
} }
}; };
......
<template>
<cr-tabbar
class="mongo-tabbar"
:value="activeIdx"
@input="oninput"
active-color="#333"
inactive-color="#666"
>
<cr-tabbar-item v-for="(item, index) in tabbarData" :key="item.name">
<div class="mongo-tabbar-item">
<svg-icon
:icon-class="[index === activeIdx ? item.activeIcon : item.icon]"
:class-name="[
{ 'mongo-tabbar-item-svg_active': index === activeIdx },
'mongo-tabbar-item-svg'
]"
/>
<span class="mongo-tabbar-item-name">{{ item.name }}</span>
</div>
</cr-tabbar-item>
</cr-tabbar>
</template>
<script>
import { mapState, mapMutations } from "vuex";
const route = ["/goods", "/user"];
const tabbarData = [
{
name: "产品",
path: "/goods",
icon: "product",
activeIcon: "product-active"
},
{
name: "我的",
path: "/user",
icon: "user",
activeIcon: "user-active"
}
];
export default {
name: "Tabbar",
data() {
return {
tabbarData
};
},
computed: {
...mapState(["activeIdx"])
},
created() {
if (this.$route.path !== route[this.activeIdx] && route.includes(this.$route.path)) {
this.setActiveIdx(route.indexOf(this.$route.path));
}
},
methods: {
...mapMutations(["setActiveIdx"]),
oninput(idx) {
this.setActiveIdx(idx);
this.$router.push(route[idx]);
}
}
};
</script>
<style lang="less">
.mongo-tabbar {
position: fixed;
bottom: 0;
z-index: 100;
box-sizing: border-box;
height: 49px;
padding: 5px 0 2px 0;
&-item {
display: flex;
flex-direction: column;
align-items: center;
width: 35px;
&-svg {
width: 28px;
height: 28px;
display: inline-block;
&_active {
display: none;
}
}
&-name {
font-size: 10px;
font-weight: 400;
color: #7f8389;
line-height: 14px;
}
}
/deep/ .cr-tabbar-item--active {
.mongo-tabbar-item-name {
color: #000000;
}
.mongo-tabbar-item-svg {
display: none;
&_active {
display: inline-block;
}
}
}
}
</style>
...@@ -6,6 +6,7 @@ import "./style/index.less"; ...@@ -6,6 +6,7 @@ import "./style/index.less";
import "amfe-flexible"; import "amfe-flexible";
import vConsole from "vconsole"; import vConsole from "vconsole";
import "@/assets/icons/index"; import "@/assets/icons/index";
import "@/service/load";
import "@/service/cherry-ui"; import "@/service/cherry-ui";
Vue.config.productionTip = false; Vue.config.productionTip = false;
......
import Vue from "vue"; import Vue from "vue";
import VueRouter from "vue-router"; import VueRouter from "vue-router";
import Home from "../views/Home.vue"; // import Home from "../views/Home.vue";
Vue.use(VueRouter); Vue.use(VueRouter);
...@@ -8,7 +8,7 @@ const routes = [ ...@@ -8,7 +8,7 @@ const routes = [
{ {
path: "/", path: "/",
name: "Home", name: "Home",
component: Home redirect: "/goods"
}, },
{ {
path: "/about", path: "/about",
...@@ -37,13 +37,42 @@ const routes = [ ...@@ -37,13 +37,42 @@ const routes = [
path: "/goods/inform", path: "/goods/inform",
name: "GoodsInform", name: "GoodsInform",
component: () => import(/* webpackChunkName: "GoodsInform" */ "../views/Goods/inform.vue") component: () => import(/* webpackChunkName: "GoodsInform" */ "../views/Goods/inform.vue")
},
{
path: "/user",
name: "User",
component: () => import("../views/User/index.vue")
},
{
path: "/policy",
name: "Policy",
component: () => import("../views/Policy/index.vue")
},
{
path: "/policy/detail",
name: "Detail",
component: () => import("../views/Policy/Detail/index.vue")
},
{
path: "/introduction",
name: "Introduction",
component: () => import("../views/Introduction/index.vue")
} }
]; ];
const originalPush = VueRouter.prototype.push;
VueRouter.prototype.push = function push(location) {
return originalPush.call(this, location).catch(err => err);
};
const router = new VueRouter({ const router = new VueRouter({
mode: "history", mode: "history",
base: process.env.BASE_URL, base: process.env.BASE_URL,
routes routes,
scrollBehavior() {
return { x: 0, y: 0 };
}
}); });
export default router; export default router;
...@@ -6,13 +6,13 @@ import "@qg/cherry-ui/dist/cherry.css"; ...@@ -6,13 +6,13 @@ import "@qg/cherry-ui/dist/cherry.css";
const { const {
Button, Button,
Image, Image,
// Icon, Icon,
Cell, Cell,
CellGroup, CellGroup,
Row, Row,
Col, Col,
Popup, Popup,
// Overlay, Overlay,
Divider, Divider,
// Loading, // Loading,
Toast, Toast,
...@@ -63,4 +63,6 @@ Vue.use(Switch); ...@@ -63,4 +63,6 @@ Vue.use(Switch);
Vue.use(Tag); Vue.use(Tag);
Vue.use(Tabbar); Vue.use(Tabbar);
Vue.use(TabbarItem); Vue.use(TabbarItem);
Vue.use(Icon);
Vue.use(Sticky); Vue.use(Sticky);
Vue.use(Overlay);
/* eslint-disable */
import Vue from 'vue';
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory
: (global = global || self, global.Vue = factory)
})(this, Vue)
export default () => {}
\ No newline at end of file
...@@ -4,8 +4,18 @@ import Vuex from "vuex"; ...@@ -4,8 +4,18 @@ import Vuex from "vuex";
Vue.use(Vuex); Vue.use(Vuex);
export default new Vuex.Store({ export default new Vuex.Store({
state: {}, state: {
mutations: {}, activeIdx: 0
actions: {}, },
mutations: {
setActiveIdx(state, value) {
state.activeIdx = value;
}
},
actions: {
setActiveIdx(state, value) {
state.activeIdx = value;
}
},
modules: {} modules: {}
}); });
...@@ -2,134 +2,133 @@ ...@@ -2,134 +2,133 @@
* Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/) * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
* http://cssreset.com * http://cssreset.com
*/ */
html, html,
body, body,
div, div,
span, span,
applet, applet,
object, object,
iframe, iframe,
h1, h1,
h2, h2,
h3, h3,
h4, h4,
h5, h5,
h6, h6,
p, p,
blockquote, blockquote,
pre, pre,
a, a,
abbr, abbr,
acronym, acronym,
address, address,
big, big,
cite, cite,
code, code,
del, del,
dfn, dfn,
em, em,
img, img,
ins, ins,
kbd, kbd,
q, q,
s, s,
samp, samp,
small, small,
strike, strike,
strong, strong,
sub, sub,
sup, sup,
tt, tt,
var, var,
b, b,
u, u,
i, i,
center, center,
dl, dl,
dt, dt,
dd, dd,
ol, ol,
ul, ul,
li, li,
fieldset, fieldset,
form, form,
label, label,
legend, legend,
table, table,
caption, caption,
tbody, tbody,
tfoot, tfoot,
thead, thead,
tr, tr,
th, th,
td, td,
article, article,
aside, aside,
canvas, canvas,
details, details,
embed, embed,
figure, figure,
figcaption, figcaption,
footer, footer,
header, header,
menu, menu,
nav, nav,
output, output,
ruby, ruby,
section, section,
summary, summary,
time, time,
mark, mark,
audio, audio,
video, video,
input { input {
margin: 0; margin: 0;
padding: 0; padding: 0;
border: 0; border: 0;
font-size: 100%; font-size: 100%;
font-weight: normal; font-weight: normal;
vertical-align: baseline; vertical-align: baseline;
} }
/* HTML5 display-role reset for older browsers */ /* HTML5 display-role reset for older browsers */
article, article,
aside, aside,
details, details,
figcaption, figcaption,
figure, figure,
footer, footer,
header, header,
menu, menu,
nav, nav,
section { section {
display: block; display: block;
} }
body { body {
line-height: 1; line-height: 1;
} }
blockquote, blockquote,
q { q {
quotes: none; quotes: none;
} }
blockquote:before, blockquote:before,
blockquote:after, blockquote:after,
q:before, q:before,
q:after { q:after {
content: none; content: none;
} }
table { table {
border-collapse: collapse; border-collapse: collapse;
border-spacing: 0; border-spacing: 0;
} }
/* custom */ /* custom */
a { a {
color: #7e8c8d; color: #7e8c8d;
text-decoration: none; text-decoration: none;
} }
li { li {
list-style: none; list-style: none;
} }
body { body {
-webkit-text-size-adjust: none; -webkit-text-size-adjust: none;
-webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: rgba(0,0,0,0);
} }
\ No newline at end of file
...@@ -124,3 +124,7 @@ ...@@ -124,3 +124,7 @@
@tag-warning-light-background-color: #ffeab7; @tag-warning-light-background-color: #ffeab7;
@tag-warning-light-color: #eaad1a; @tag-warning-light-color: #eaad1a;
// User color
@user-background-color: #F4F4F4;
@user-module-background-color: #FFFFFF;
...@@ -10,20 +10,22 @@ ...@@ -10,20 +10,22 @@
</cr-sticky> --> </cr-sticky> -->
<good-list :list="goodsList" /> <good-list :list="goodsList" />
<ai-test-tip /> <ai-test-tip />
<tabbar></tabbar>
</div> </div>
</template> </template>
<script> <script>
import AiTestTip from "./modules/AiTestTip"; import AiTestTip from "./modules/AiTestTip";
import GoodList from "@/components/GoodList/index"; import GoodList from "@/components/GoodList/index";
import Tabbar from "@/components/Tabbar";
import goodsList from "@/api/goodsList.mock"; import goodsList from "@/api/goodsList.mock";
export default { export default {
name: "GoodsList", name: "GoodsList",
components: { components: {
AiTestTip, AiTestTip,
GoodList GoodList,
Tabbar
}, },
data() { data() {
return { return {
......
...@@ -6,43 +6,53 @@ ...@@ -6,43 +6,53 @@
为保证被保险人的保险权益在理赔时不受影响,请确认被保险人健康状况是否符合以下投保条件: 为保证被保险人的保险权益在理赔时不受影响,请确认被保险人健康状况是否符合以下投保条件:
</div> </div>
</div> </div>
<card :title="true" class="inform-content"> <card title="true" class="inform-content">
<span slot="title" class="inform-content-title"> <span slot="title" class="inform-content-title">
请如实告知 请如实告知
<strong>被保人</strong> 是否有以下情形之一 <strong>被保人</strong> 是否有以下情形之一
</span> </span>
<p>以下情况全为“否”,即符合投保条件:</p> <p>以下情况全为“否”,即符合投保条件:</p>
<!-- eslint-disable-next-line --> <!-- eslint-disable-next-line -->
<p>1.被保险人职业是否属于以下职业:接触放射线或放射性物质,接触化学、易燃或易爆物质,有毒及危险物质生产运输,参与矿物或煤炭开采,暴露于烟尘或粉尘,参加高空、海洋、水下、地下、隧道、桥梁作业或活动,从事渔业捕捉,森林砍伐业或相关作业,森林防火,建筑施工,机械设备制造加工操作,金属/合金冶炼,3吨及3吨以上重型卡车、砂石车、液化气化油罐车驾驶及随车工作,高压电、电缆作业,拆船工作,私人保镖,战地记者,驯兽师,无固定职业,消防队员、特种兵、军事院校学生、入伍受训新兵、消防爆破、缉毒及防爆警察,参与镇暴或军警行动,前线军人。</p> <p>1.被保险人职业是否属于以下职业:接触放射线或放射性物质,接触化学、易燃或易爆物质,有毒及危险物质生产运输,参与矿物或煤炭开采,暴露于烟尘或粉尘,参加高空、海洋、水下、地下、隧道、桥梁作业或活动,从事渔业捕捉,森林砍伐业或相关作业,森林防火,建筑施工,机械设备制造加工操作,金属/合金冶炼,3吨及3吨以上重型卡车、砂石车、液化气化油罐车驾驶及随车工作,高压电、电缆作业,拆船工作,私人保镖,战地记者,驯兽师,无固定职业,消防队员、特种兵、军事院校学生、入伍受训新兵、消防爆破、缉毒及防爆警察,参与镇暴或军警行动,前线军人。</p>
<!-- eslint-disable-next-line --> <!-- eslint-disable-next-line -->
<p>2. 被保险人过去 1 年内是否发现健康检查异常(包括但不限于血液、超声、影像检查、内镜、病理检查等),过去 2 年内是否住院或被要求进一步检查、手术或治疗(不包括剖腹产/顺产/急性胃肠炎/单次发作已痊愈的肺炎/上呼吸道感染住院)。</p> <p>2. 被保险人过去 1 年内是否发现健康检查异常(包括但不限于血液、超声、影像检查、内镜、病理检查等),过去 2 年内是否住院或被要求进一步检查、手术或治疗(不包括剖腹产/顺产/急性胃肠炎/单次发作已痊愈的肺炎/上呼吸道感染住院)。</p>
<!-- eslint-disable-next-line --> <!-- eslint-disable-next-line -->
<p>3. 被保险人目前或过往是否患有下列疾病:良、恶性肿瘤(含原位癌),2 级或以上高血压(收缩压大于 160mmHg,或舒张压大于 100mmHg),心脏疾病,主动脉疾病,脑梗死(脑栓塞或脑血栓),脑出血,脑外伤后遗症,肾脏疾病,慢性肝脏疾病,血友病,重型再障性贫血,系统性红斑狼疮,类风湿性关节炎,风湿热,糖尿病,阿尔茨海默病,帕金森氏病,运动神经元病,多发性硬化,重症肌无力,硬皮病,克隆病,溃疡性结肠炎,慢性胰腺炎,癫痫,精神病,先天性疾病,法定传染病(包含甲类及乙类),慢性阻塞性肺病,瘫痪,性病,艾滋病及 HIV 阳性,慢性酒精中毒。是否曾经或正在使用毒品或违禁药物、是否有智能障碍或痴呆、失明、聋哑、身体任何部位缺失、畸形及功能障碍、重听、视力障碍(近视1000度以上)。</p> <p>3. 被保险人目前或过往是否患有下列疾病:良、恶性肿瘤(含原位癌),2 级或以上高血压(收缩压大于 160mmHg,或舒张压大于 100mmHg),心脏疾病,主动脉疾病,脑梗死(脑栓塞或脑血栓),脑出血,脑外伤后遗症,肾脏疾病,慢性肝脏疾病,血友病,重型再障性贫血,系统性红斑狼疮,类风湿性关节炎,风湿热,糖尿病,阿尔茨海默病,帕金森氏病,运动神经元病,多发性硬化,重症肌无力,硬皮病,克隆病,溃疡性结肠炎,慢性胰腺炎,癫痫,精神病,先天性疾病,法定传染病(包含甲类及乙类),慢性阻塞性肺病,瘫痪,性病,艾滋病及 HIV 阳性,慢性酒精中毒。是否曾经或正在使用毒品或违禁药物、是否有智能障碍或痴呆、失明、聋哑、身体任何部位缺失、畸形及功能障碍、重听、视力障碍(近视1000度以上)。</p>
<!-- eslint-disable-next-line --> <!-- eslint-disable-next-line -->
<p>4. 过去 1 年内是否存在下列症状:反复头痛、晕厥、胸痛、气急、紫绀、持续反复发热、抽搐、不明原因出血、皮下出血点、咯血、反复呕吐、进食梗噎感或吞咽困难、呕血、浮肿、腹痛、黄疸、便血、血尿、蛋白尿、性质不明的肿块、消瘦(非健身原因所致的体重减轻 5公斤以上) 。</p> <p>4. 过去 1 年内是否存在下列症状:反复头痛、晕厥、胸痛、气急、紫绀、持续反复发热、抽搐、不明原因出血、皮下出血点、咯血、反复呕吐、进食梗噎感或吞咽困难、呕血、浮肿、腹痛、黄疸、便血、血尿、蛋白尿、性质不明的肿块、消瘦(非健身原因所致的体重减轻 5公斤以上) 。</p>
<!-- eslint-disable-next-line --> <!-- eslint-disable-next-line -->
<p>5. 适用于女性被保险人:是否曾患有葡萄胎或其他妊娠滋养细胞疾病、宫颈不典型增生;是否有半年内存在阴道异常出血、乳头异常溢液、疼痛、糜烂或回缩、乳房表面皮肤凹陷、皱褶或皮肤收缩等症状。</p> <p>5. 适用于女性被保险人:是否曾患有葡萄胎或其他妊娠滋养细胞疾病、宫颈不典型增生;是否有半年内存在阴道异常出血、乳头异常溢液、疼痛、糜烂或回缩、乳房表面皮肤凹陷、皱褶或皮肤收缩等症状。</p>
<p>6. 2 周岁以下被保险人出生时体重是否低于 2.5 公斤,是否早产,窒息,发育迟缓,脑瘫。</p> <p>6. 2 周岁以下被保险人出生时体重是否低于 2.5 公斤,是否早产,窒息,发育迟缓,脑瘫。</p>
<!-- eslint-disable-next-line --> <!-- eslint-disable-next-line -->
<p>7.被保险人是否曾被保险公司解除合同或投保时被拒绝、延期、附加条款承保或有过任何形式的人身索赔?被保险人最近一年内是否已在其它保险公司申请累计重大疾病保险保额达50万以上?</p> <p>7.被保险人是否曾被保险公司解除合同或投保时被拒绝、延期、附加条款承保或有过任何形式的人身索赔?被保险人最近一年内是否已在其它保险公司申请累计重大疾病保险保额达50万以上?</p>
</card> </card>
<div class="inform-btns"> <div class="inform-btns">
<cr-button @click="$router.back()">不符合</cr-button> <cr-button @click="$router.back()">不符合</cr-button>
<cr-button type="warning" @click="conform">符合,立即投保</cr-button> <cr-button type="warning" @click="conform">符合,立即投保</cr-button>
</div> </div>
<record-layer v-model="showLayer" desc="敬请期待"></record-layer>
</div> </div>
</template> </template>
<script> <script>
import card from "@/components/Card"; import card from "@/components/Card";
import RecordLayer from "@/components/RecordLayer";
export default { export default {
name: "GoodsInform", name: "GoodsInform",
components: { components: {
card card,
RecordLayer
},
data() {
return {
showLayer: false
};
}, },
methods: { methods: {
conform() { conform() {
this.$toast("平台备案中,不能支付,敬请期待"); // this.$toast("平台备案中,不能支付,敬请期待");
this.showLayer = true;
} }
} }
}; };
......
...@@ -35,6 +35,7 @@ export default { ...@@ -35,6 +35,7 @@ export default {
@import "../../../style/mixins.less"; @import "../../../style/mixins.less";
.ai-test { .ai-test {
margin-bottom: 49px;
padding: 20px 16px 25.5px; padding: 20px 16px 25.5px;
&-tip { &-tip {
text-align: center; text-align: center;
......
@import "../../style/var.less";
@import "../../style/mixins.less";
.itd {
position: absolute;
top: 0;
bottom: 0;
background-color: #FFFFFF;
&-divider {
margin: 0;
border-color: #ECE9E9;
}
&-head {
width: 100% !important;
& > div {
width: 100% !important;
z-index: 100;
}
/deep/ .cr-tabbar {
background-color: #f5f5f5;
font-size: @font-size-16;
padding: @padding-lg+1 0;
&-item {
position: relative;
&::after {
position: absolute;
top: 26px;
// transition: width .2s linear;
content: " ";
display: block;
width: 0;
height: 4px;
background: @orange-light;
border-radius: @border-radius-lx;
}
&--active {
font-weight: 600;
&::after {
width: 32px;
}
}
}
}
}
&-quali {
padding: 13px 20px 24px;
font-size: 18px;
font-weight: 600;
color: #242629;
line-height: 24px;
background-color: #FFFFFF;
&-item {
display: flex;
flex-direction: column;
&:not(:first-child), &:not(:last-child) {
margin: 24px 0px 24px;
}
&:first-child, &:last-child {
margin: 0;
}
&-title {
margin-bottom: 16px;
font-size: 18px;
font-weight: 600;
color: #242629;
line-height: 24px;
}
&-content {
padding: 13px 20px 16px;
background: #F6F7FA;
border-radius: 14px;
font-size: 12px;
font-weight: 400;
color: #333333;
line-height: 18px;
}
&-extra {
padding: 20px 20px 16px;
background: #F6F7FA;
border-radius: 14px;
&:not(:last-child) {
margin: 10px 0;
}
&-desc {
margin-top: 12px;
font-size: 12px;
font-weight: 400;
color: #333333;
line-height: 18px;
text-align: center;
}
}
}
}
&-product {
padding: 16px 20px 0;
&-pro {
display: flex;
&-title {
padding: 14px 0 31px 18px;
width: 121px;
background: #F6F7FA;
border-radius: 16px 0px 0px 0px;
font-size: 12px;
font-weight: 600;
color: #666666;
line-height: 14px;
}
&-value {
flex: 1;
padding: 14px 0 28px 13px;
font-size: 12px;
font-weight: 600;
color: #666666;
line-height: 14px;
}
}
&-comp {
display: flex;
&-title {
padding: 0 0 19px 18px;
width: 121px;
background: #F6F7FA;
font-size: 12px;
font-weight: 600;
color: #666666;
line-height: 20px;
}
&-value {
flex: 1;
padding: 0 0 16px 13px;
font-size: 12px;
font-weight: 400;
color: #333333;
line-height: 20px;
}
}
&-divider {
margin: 0;
border-color: #ECE9E9;
}
&-no {
display: flex;
&-title {
padding: 20px 0 0px 18px;
width: 121px;
border-radius: 0px 0px 0px 16px;
background: #F6F7FA;
font-size: 12px;
font-weight: 600;
color: #666666;
line-height: 20px;
}
&-value {
flex: 1;
padding: 20px 0 16px 13px;
font-size: 12px;
font-weight: 400;
color: #333333;
line-height: 20px;
}
}
}
&-comp {
padding: 16px 20px 0;
&-info {
display: flex;
&-title {
padding: 14px 0 31px 18px;
width: 121px;
background: #F6F7FA;
border-radius: 16px 0px 0px 0px;
font-size: 12px;
font-weight: 600;
color: #666666;
line-height: 14px;
}
&-value {
flex: 1;
padding: 14px 0 28px 13px;
font-size: 12px;
font-weight: 600;
color: #666666;
line-height: 14px;
}
}
&-branch {
display: flex;
&-title {
padding: 0 0 19px 18px;
width: 121px;
background: #F6F7FA;
font-size: 12px;
font-weight: 600;
color: #666666;
line-height: 20px;
}
&-value {
flex: 1;
padding: 0 0 16px 13px;
font-size: 12px;
font-weight: 400;
color: #333333;
line-height: 20px;
}
}
&-item {
display: flex;
&-title {
padding: 16px 0 16px 18px;
width: 121px;
background: #F6F7FA;
font-size: 12px;
font-weight: 600;
color: #666666;
line-height: 20px;
}
&-value {
flex: 1;
padding: 16px 0 16px 13px;
font-size: 12px;
font-weight: 400;
color: #333333;
line-height: 20px;
}
&:last-child {
.itd-comp-item-title {
border-radius: 0 0 0 16px;
}
}
}
}
}
<template>
<div class="itd">
<cr-sticky class="itd-head">
<cr-tabbar v-model="active" active-color="#333" inactive-color="#666">
<cr-tabbar-item>经营资质</cr-tabbar-item>
<cr-tabbar-item>保险产品信息披露</cr-tabbar-item>
<cr-tabbar-item>合作保险公司披露</cr-tabbar-item>
</cr-tabbar>
</cr-sticky>
<component :is="comName"></component>
</div>
</template>
<script>
import "./index.less";
import BusinessQuali from "./modules/BusinessQuali";
import Company from "./modules/Company";
import Product from "./modules/Product";
const components = ["BusinessQuali", "Company", "Product"];
export default {
name: "PolicyList",
components: {
BusinessQuali,
Company,
Product
},
data() {
return {
active: 0
};
},
computed: {
comName: function() {
return components[this.active];
}
}
};
</script>
<template>
<div class="itd-quali">
<div class="itd-quali-item">
<p class="itd-quali-item-title">1. 主体名称和网址</p>
<div class="itd-quali-item-content">
中文名称:全天候保险代理股份有限公司<br />
中文简称:芒果保险<br />
网站地址:www.qthbx.com
</div>
</div>
<div class="itd-quali-item">
<p class="itd-quali-item-title">2. 注册资本</p>
<div class="itd-quali-item-content">
人民币伍仟万元
</div>
</div>
<div class="itd-quali-item">
<p class="itd-quali-item-title">3. 成立时间</p>
<div class="itd-quali-item-content">
2006年2月10日
</div>
</div>
<div class="itd-quali-item">
<p class="itd-quali-item-title">4. 注册地址</p>
<div class="itd-quali-item-content">
北京市顺义区仁和镇顺通路25号5幢511-2室
</div>
</div>
<div class="itd-quali-item">
<p class="itd-quali-item-title">5. 业务范围</p>
<div class="itd-quali-item-content">
在全国区域内(港、澳、台除外)代理销售保险产品;代理收取保险费;代理相关保险业务的损失勘察和理赔;中国保监会批准的其他业务。
</div>
</div>
<div class="itd-quali-item">
<p class="itd-quali-item-title">6. 经营区域</p>
<div class="itd-quali-item-content">
在全国区域内(港、澳、台除外)
</div>
</div>
<div class="itd-quali-item">
<p class="itd-quali-item-title">7. 法定代表人</p>
<div class="itd-quali-item-content">
陆慧瑗
</div>
</div>
<div class="itd-quali-item">
<p class="itd-quali-item-title">8. 客服与消费者投诉电话</p>
<div class="itd-quali-item-content">
010-82194734
</div>
</div>
<div class="itd-quali-item">
<p class="itd-quali-item-title">9.分支机构</p>
<div class="itd-quali-item-content">
分公司名称:<br />
办公地址:<br />
<br />
分公司名称:<br />
办公地址:<br />
<br />
分公司名称:<br />
办公地址:
</div>
</div>
<div class="itd-quali-item">
<p class="itd-quali-item-title">10. 相关资质</p>
<div class="itd-quali-item-content">
「芒果保险」是2020年成立的互联网保险平台,我们的网站经过中国银保监会核准具有互联网销售资质。
查询地址:http://icid.iachina.cn/选择“互联网保险信息披露>中介类信息披露>全天候保险代理股份有限公司”即可查看。
</div>
<div class="itd-quali-item-extra">
<cr-image width="295px" height="166px" fit="cover" src="" />
<p class="itd-quali-item-extra-desc">经营保险代理业务许可证</p>
</div>
<div class="itd-quali-item-extra">
<cr-image width="295px" height="166px" fit="cover" src="" />
<p class="itd-quali-item-extra-desc">营业执照</p>
</div>
</div>
</div>
</template>
<script>
import "../index.less";
import avatar from "@/assets/images/user/avatar@2x.png";
export default {
name: "BusinessQuali",
data() {
return {
avatar
};
}
};
</script>
<template>
<div class="itd-product">
<div class="itd-product-pro">
<p class="itd-product-pro-title">保险产品名称</p>
<p class="itd-product-pro-value">万家保·重疾轻症险</p>
</div>
<div class="itd-product-comp">
<p class="itd-product-comp-title">保险公司</p>
<p class="itd-product-comp-value">华泰财产保险有限公司</p>
</div>
<cr-divider class="itd-divider" :hairline="false" />
<div class="itd-product-no">
<p class="itd-product-no-title">备案编号注册编号</p>
<p class="itd-product-no-value">
华泰财险重大疾病保险条款(B款) <br />
华泰财险附加重大疾病轻症综合保险条款<br />
华泰财险附加保险费分期支付条款<br />
<br />
C00015431912018061501152<br />
C00015432622017111500872<br />
C00015431922018061503991
</p>
</div>
</div>
</template>
<script>
import "../index.less";
export default {
name: "Company",
data() {
return {};
}
};
</script>
<template>
<div class="itd-comp">
<div class="itd-comp-info">
<p class="itd-comp-info-title">保险公司名称</p>
<p class="itd-comp-info-value">华泰财产保险有限公司</p>
</div>
<div class="itd-comp-branch">
<p class="itd-comp-branch-title">已设分支机构</p>
<p class="itd-comp-branch-value">
北京、上海、天津、重庆、江苏、广东、陕西、四川、云南、辽宁、浙江、河北、湖南、湖北、安徽、山西、福建、山东、广西、河南、江西、深圳、青岛、大连、宁波、贵州、内蒙古、厦门、黑龙江、新疆、宁夏、吉林、甘肃
</p>
</div>
<cr-divider class="itd-divider" :hairline="false" />
<div class="itd-comp-item">
<p class="itd-comp-item-title">业务合作范围</p>
<p class="itd-comp-item-value">互联网保险业务</p>
</div>
<cr-divider class="itd-divider" :hairline="false" />
<div class="itd-comp-item">
<p class="itd-comp-item-title">保险公司网址</p>
<p class="itd-comp-item-value">http://pc.ehuatai.com</p>
</div>
<cr-divider class="itd-divider" :hairline="false" />
<div class="itd-comp-item">
<p class="itd-comp-item-title">客服电话</p>
<p class="itd-comp-item-value">400-609-5509</p>
</div>
</div>
</template>
<script>
import "../index.less";
export default {
name: "Product",
data() {
return {};
}
};
</script>
.button() {
height: 28px;
border-radius: 8px;
border: 1px solid #787EFF;
font-size: 14px;
font-weight: 400;
color: #787EFF;
line-height: 16px;
&:first-child {
margin-right: 8px;
}
}
.card-head() {
display: flex;
justify-content: space-between;
margin-bottom: 16px;
span:first-child {
font-size: 18px;
font-weight: 600;
color: #242629;
line-height: 24px;
}
span:last-child {
font-size: 12px;
font-weight: 400;
color: #787EFF;
line-height: 24px;
}
.svg-icon {
padding: 4px 0;
width: 16px;
height: 16px;
}
}
.card-body() {
div {
display: flex;
justify-content: space-between;
span:first-child {
font-size: 12px;
font-weight: 400;
color: #666666;
line-height: 24px;
}
span:last-child {
font-size: 12px;
font-weight: 600;
color: #333333;
line-height: 24px;
}
}
}
.policy-detail {
position: relative;
background: #F6F6F6;
&:before {
position: absolute;
width: 375px;
height: 269px;
border: 0;
content: '';
background: linear-gradient(360deg,rgba(244,244,244,1) 0%,rgba(255,200,66,1) 100%);
}
&:after {
position: absolute;
top: 38px;
right: 0;
width: 36px;
height: 19px;
content: '';
background: url('../../../assets/images/policy/detail/point@2x.png') no-repeat 0 0 /cover;
}
&-body {
position: absolute;
left: 0;
right: 0;
.Pdb-status {
margin: 32px 0 5px 20px;
font-size: 28px;
font-weight: 600;
color: #333333;
line-height: 40px;
}
.Pdb-payment {
display: flex;
align-items: center;
justify-content: center;
margin: 0 0 24px 20px;
padding-left: 4px;
width: 73px;
height: 20px;
background: #000000;
border-radius: 8px;
opacity: 0.2;
&-text {
margin-right: 1px;
font-size: 12px;
font-weight: 400;
color: #FFFFFF;
line-height: 12px;
}
&-svg {
width: 12px;
height: 12px;
}
}
.Pdb-insurance {
margin: 0 16px 10px;
padding: 20px;
background: #FFFFFF;
box-shadow: 0px 5px 25px 0px rgba(0,0,0,0.07);
border-radius: 14px;
&-name {
margin-bottom: 12px;
font-size: 18px;
font-weight: 600;
color: #242629;
line-height: 24px;
}
&-no {
margin-bottom: 16px;
font-size: 12px;
font-weight: 400;
color: #999999;
line-height: 16px;
}
&-operation {
.Pdbi-operation-button { .button }
}
}
.Pdb-content {
margin: 0 16px 10px;
padding: 20px;
background: #FFFFFF;
border-radius: 14px;
&-head {
.card-head
}
&-body {
margin-bottom: 8px;
.card-body
}
&-operation {
.Pdbc-button { .button }
}
&-user {
margin-top: 24px;
.Pdbc-user-who {
margin-bottom: 16px;
font-size: 18px;
font-weight: 600;
color: #242629;
line-height: 24px;
}
.Pdbc-user-info {
display: flex;
justify-content: space-around;
align-items: center;
width: 100%;
height: 50px;
background: #F6F7FA;
border-radius: 14px;
span:first-child {
font-size: 14px;
font-weight: 500;
color: #333333;
line-height: 24px;
}
span:last-child {
font-size: 14px;
font-weight: 400;
color: #666666;
line-height: 24px;
}
}
}
&-service {
margin: 0 16px 10px;
padding: 20px;
background: #FFFFFF;
border-radius: 14px;
.Pdsc-service-head {
.card-head
}
.Pdsc-service-body {
.card-body
}
.Pdsc-service-question {
margin-top: 24px;
.card-head
}
.Pdsc-service-divider {
&:before {
height: 1px;
border-color: #EBEBEB;
}
}
}
}
}
}
\ No newline at end of file
<template>
<div class="policy-detail">
<div class="policy-detail-body">
<p class="Pdb-status">保障中</p>
<div class="Pdb-payment">
<span class="Pdb-payment-text">缴费记录</span>
<svg-icon class-name="Pdb-payment-svg" icon-class="payment-record" />
</div>
<div class="Pdb-insurance">
<p class="Pdb-insurance-name">国民保·百万医疗险</p>
<p class="Pdb-insurance-no">NO.XXXXXXXXXXXXXXXXXXXXXXXX<br />由XXXXXXXXX承保</p>
<div class="Pdb-insurance-operation">
<cr-button class="Pdbi-operation-button">已开通次年续保</cr-button>
<cr-button class="Pdbi-operation-button">申请理赔</cr-button>
</div>
</div>
<div class="Pdb-content">
<div class="Pdb-content-head">
<span class="Pdbc-head-name">保障内容</span>
<span class="Pdbc-head-status">查看详情</span>
</div>
<div class="Pdb-content-body">
<div class="Pdbc-body-item">
<span>100种重大疾病医疗保险金(0免赔额)</span>
<span>600万</span>
</div>
<div class="Pdbc-body-item">
<span>一般医疗保险金(1万免赔额)</span>
<span>300万</span>
</div>
<div class="Pdbc-body-item">
<span>质子重离子医疗保险金(60%赔付)</span>
<span>600万</span>
</div>
<div class="Pdbc-body-item">
<span>意外身故</span>
<span>1万</span>
</div>
<div class="Pdbc-body-item">
<span>意外伤残</span>
<span>1万</span>
</div>
<div class="Pdbc-body-item">
<span>意外住院津贴</span>
<span>100元/天</span>
</div>
<div class="Pdbc-body-item">
<span>生效日期</span>
<span>2020.5.31</span>
</div>
<div class="Pdbc-body-item">
<span>终止日期</span>
<span>2021.5.31</span>
</div>
</div>
<div class="Pdb-content-operation">
<cr-button class="Pdbc-button">电子保单</cr-button>
</div>
<div class="Pdb-content-user">
<p class="Pdbc-user-who">投保人</p>
<div class="Pdbc-user-info">
<span>王*闹</span>
<span>身份证号 1333**********3445</span>
</div>
</div>
<div class="Pdb-content-user">
<p class="Pdbc-user-who">被保人</p>
<div class="Pdbc-user-info">
<span>王*闹</span>
<span>身份证号 1333**********3445</span>
</div>
</div>
</div>
<div class="Pdb-content-service">
<div class="Pdsc-service-head">
<span>增值服务</span>
<span>查看详情</span>
</div>
<div class="Pdsc-service-body">
<div>
<span>重疾快速就医</span>
</div>
<div>
<span>住院押金垫付</span>
</div>
</div>
<div class="Pdsc-service-question">
<span>常见问题</span>
<svg-icon icon-class="arrow" />
</div>
<cr-divider class="Pdsc-service-divider" :hairline="false" />
<div class="Pdsc-service-agreement">
<span>保险条款</span>
<span>健康告知</span>
<span>投保须知与声明</span>
<span>服务协议</span>
</div>
<insurance-recommend />
</div>
</div>
</div>
</template>
<script>
import "./index.less";
import point from "@/assets/images/policy/detail/point@2x.png";
import InsuranceRecommend from "../modules/InsuranceRecommend";
export default {
name: "PolicyList",
components: {
InsuranceRecommend
},
data() {
return {
point
};
}
};
</script>
@import "../../style/var.less";
@import "../../style/mixins.less";
.policy {
background-color: @background-color;
&-tab {
width: 100% !important;
& > div {
width: 100% !important;
z-index: 100;
}
/deep/ .cr-tabbar {
background-color: #f5f5f5;
font-size: @font-size-16;
padding: @padding-lg+1 0;
&-item {
position: relative;
&::after {
position: absolute;
left: 0;
top: 26px;
// transition: width .2s linear;
content: " ";
display: block;
width: 0;
height: 4px;
background: @orange-light;
border-radius: @border-radius-lx;
}
&--active {
font-weight: 600;
&::after {
width: 32px;
}
}
}
}
}
&-item {
position: relative;
margin: 10px 16px;
padding: 20px 0 20px 20px;
background: #FFFFFF;
border-radius: 14px;
&-pro {
display: flex;
align-items: center;
margin-bottom: 8px;
&-name{
padding: 4px 0 2px 0;
margin-right: 6px;
font-size: 16px;
font-weight: 600;
color: #242629;
}
&-type{
padding: 3px 0 1px 0;
width: 52px;
border-radius: 8px 2px 8px 2px;
text-align: center;
font-size: 11px;
font-weight: 400;
&_illness {
background: #FFD8BF;
color: #FF6702;
}
&_life {
background: #F3F2F1;
color: #DDB984;
}
&_casualty {
background: #F6E8FF;
color: #858AFF;
}
&_medical {
background: #FFEAB7;
color: #EAAD1A;
}
}
&-status {
position: absolute;
top: 20px;
right: 20px;
font-size: 12px;
font-weight: 400;
color: #999999;
line-height: 16px;
}
}
&-recognizee, &-time {
margin-bottom: 8px;
font-size: 12px;
font-weight: 400;
color: #999999;
line-height: 16px;
}
&-operation {
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
width: 100%;
&-button {
margin: 9px 8px 0 0;
// margin: 9px 8px 11px 0;
padding: 0 !important;
width: 102px;
height: 28px;
border-radius: 8px;
border: 1px solid #787EFF;
font-size: 14px;
font-weight: 400;
color: #787EFF;
line-height: 16px;
&:last-child {
margin-right: 12px;
}
&_paid {
border: 0;
background: #F4F5FF;
color: #787EFF;
}
}
&-image {
position: absolute;
right: 0;
bottom: 0;
}
&-desc {
margin-top: 9px;
font-size: 12px;
font-weight: 400;
line-height: 16px;
&_wait {
color: #999999;
}
&_result {
color: #F94C4C;
}
}
}
}
&-divider {
margin: 10px 130px 16px;
font-size: 11px;
font-weight: 400;
color: #CCCCCC;
line-height: 11px;
&:after {
margin-left: 0;
border: 1px solid #CCCCCC;
}
&:before {
margin-right: 0;
border: 1px solid #CCCCCC;
}
}
&-recommend {
position: relative;
margin: 0 16px 11px;
padding: 29px 23px 32px;
background: #FFFFFF;
box-shadow: 0px 5px 25px 0px rgba(0,0,0,0.07);
border-radius: 14px;
&-content {
display: flex;
margin-bottom: 18px;
width: 100%;
.Prc-left {
margin-right: 20px;
}
.Prc-right {
&-title {
margin: 1px 0 9px 0;
span:first-child {
font-size: 28px;
font-weight: 600;
color: #FF6702;
line-height: 40px;
}
span:last-child {
font-size: 28px;
font-weight: 600;
color: #242629;
line-height: 40px;
}
}
&-desc {
font-size: 14px;
font-weight: 400;
color: #999999;
line-height: 16px;
}
}
}
&-button {
width: 296px;
height: 50px;
background: #FFC842;
border-radius: 14px;
z-index: 0;
&:after {
width: 296px;
height: 52px;
z-index: -1;
background: rgba(255,200,66,1);
border-radius: 14px;
opacity: 0.4;
filter: blur(10px);
position: absolute;
content: '';
left: 0;
top: 12px;
}
/deep/ .cr-button__text {
font-size: 16px;
font-weight: 600;
color: #333333;
line-height: 22px;
}
}
&-angle {
position: absolute;
top: -5px;
left: -5px;
}
}
&-none {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin: 0 16px;
height: 374px;
background: #FFFFFF;
border-radius:14px;
&-title {
margin: 14px 0 9px 0;
font-size: 16px;
font-weight: 600;
color: #999999;
}
&-desc {
font-size: 11px;
font-weight: 400;
color: #CCCCCC;
}
}
}
<template>
<div class="policy">
<cr-sticky class="policy-tab">
<cr-tabbar v-model="active" active-color="#333" inactive-color="#666">
<cr-tabbar-item>全部</cr-tabbar-item>
<cr-tabbar-item>本人</cr-tabbar-item>
<cr-tabbar-item>父母</cr-tabbar-item>
<cr-tabbar-item>配偶</cr-tabbar-item>
<cr-tabbar-item>子女</cr-tabbar-item>
</cr-tabbar>
</cr-sticky>
<!-- <policy-item></policy-item>
<cr-divider class="policy-divider">我是有底线的</cr-divider>
<insurance-recommend></insurance-recommend> -->
<div class="policy-none">
<cr-image round width="143px" height="143px" :src="policyDefault" />
<p class="policy-none-title">暂无保单</p>
<p class="policy-none-desc">赶紧去看看有哪些精品保险吧</p>
</div>
</div>
</template>
<script>
import "./index.less";
import policyDefault from "@/assets/images/policy/policy-default@2x.png";
// import InsuranceRecommend from "./modules/InsuranceRecommend";
// import PolicyItem from "./modules/PolicyItem";
export default {
name: "PolicyList",
// components: {
// InsuranceRecommend,
// PolicyItem
// },
data() {
return {
active: 0,
policyDefault
};
}
};
</script>
<template>
<div class="policy-recommend">
<div class="policy-recommend-content">
<cr-image class="Prc-left" width="72px" height="72px" :src="recommendContent" />
<div class="Prc-right">
<p class="Prc-right-title">
<span>50万</span>
<span>重疾保障</span>
</p>
<p class="Prc-right-desc">优势介绍 优势介绍 优势介绍</p>
</div>
</div>
<cr-button class="policy-recommend-button">点此投保</cr-button>
<cr-image class="policy-recommend-angle" width="65px" height="65px" :src="recommendAngle" />
</div>
</template>
<script>
import "../index.less";
import recommendAngle from "@/assets/images/policy/recommend-angle@2x.png";
import recommendContent from "@/assets/images/policy/recommend-content@2x.png";
export default {
name: "InsuranceRecommend",
data() {
return {
recommendAngle,
recommendContent
};
}
};
</script>
<template>
<div>
<div class="policy-item">
<div class="policy-item-pro">
<p class="policy-item-pro-name">国民保·百万医疗险</p>
<p class="policy-item-pro-type policy-item-pro-type_medical">医疗保障</p>
</div>
<p class="policy-item-recognizee">被保人:王*闹</p>
<p class="policy-item-time">保障期限:2020.5.31至2021.5.30</p>
<div class="policy-item-operation">
<cr-button class="policy-item-operation-button">为家人投保</cr-button>
<cr-button class="policy-item-operation-button">电子保单</cr-button>
</div>
<cr-image
class="policy-item-operation-image"
width="63px"
height="63px"
fit="cover"
:src="guarantee"
/>
</div>
<div class="policy-item">
<div class="policy-item-pro">
<p class="policy-item-pro-name">国民保·百万意外险</p>
<p class="policy-item-pro-type policy-item-pro-type_casualty">意外保障</p>
</div>
<p class="policy-item-recognizee">被保人:王*闹</p>
<p class="policy-item-time">保障期限:2020.5.31至2021.5.30</p>
<div class="policy-item-operation">
<cr-button class="policy-item-operation-button policy-item-operation-button_paid"
>开启自动续费</cr-button
>
<cr-button class="policy-item-operation-button">电子保单</cr-button>
<p class="policy-item-operation-desc policy-item-operation-desc_result">
有XX.X元扣费失败,请立即开通自动续费
</p>
</div>
<cr-image
class="policy-item-operation-image"
width="63px"
height="63px"
fit="cover"
:src="guarantee"
/>
</div>
<div class="policy-item">
<div class="policy-item-pro">
<p class="policy-item-pro-name">国民保·百万医疗险</p>
<p class="policy-item-pro-type policy-item-pro-type_medical">医疗保障</p>
<p class="policy-item-pro-status">待生效</p>
</div>
<p class="policy-item-recognizee">被保人:王*闹</p>
<p class="policy-item-time">保障期限:2020.5.31至2021.5.30</p>
<div class="policy-item-operation">
<cr-button class="policy-item-operation-button">为家人投保</cr-button>
<cr-button class="policy-item-operation-button">电子保单</cr-button>
</div>
</div>
<div class="policy-item">
<div class="policy-item-pro">
<p class="policy-item-pro-name">国民保·百万医疗险</p>
<p class="policy-item-pro-type policy-item-pro-type_illness">重疾保障</p>
<p class="policy-item-pro-status">待支付</p>
</div>
<p class="policy-item-recognizee">被保人:王*闹</p>
<p class="policy-item-time">保障期限:2020.5.31至2021.5.30</p>
<div class="policy-item-operation">
<cr-button class="policy-item-operation-button policy-item-operation-button_paid"
>去支付</cr-button
>
</div>
</div>
<div class="policy-item">
<div class="policy-item-pro">
<p class="policy-item-pro-name">国民保·百万医疗险</p>
<p class="policy-item-pro-type policy-item-pro-type_life">寿险保障</p>
<p class="policy-item-pro-status">退款中</p>
</div>
<p class="policy-item-recognizee">被保人:王*闹</p>
<p class="policy-item-time">保障期限:2020.5.31至2021.5.30</p>
<div class="policy-item-operation">
<cr-button class="policy-item-operation-button">联系客服</cr-button>
<p class="policy-item-operation-desc policy-item-operation-desc_result">
退保退款中,请注意查收
</p>
</div>
</div>
<div class="policy-item">
<div class="policy-item-pro">
<p class="policy-item-pro-name">国民保·百万医疗险</p>
<p class="policy-item-pro-type policy-item-pro-type_life">寿险保障</p>
<p class="policy-item-pro-status">出单中</p>
</div>
<p class="policy-item-recognizee">被保人:王*闹</p>
<p class="policy-item-time">保障期限:2020.5.31至2021.5.30</p>
<div class="policy-item-operation">
<cr-button class="policy-item-operation-button">联系客服</cr-button>
<p class="policy-item-operation-desc policy-item-operation-desc_wait">
正在出单,请耐心等待…
</p>
</div>
</div>
<div class="policy-item">
<div class="policy-item-pro">
<p class="policy-item-pro-name">国民保·百万医疗险</p>
<p class="policy-item-pro-type policy-item-pro-type_life">寿险保障</p>
<p class="policy-item-pro-status">投保失败</p>
</div>
<p class="policy-item-recognizee">被保人:王*闹</p>
<p class="policy-item-time">保障期限:2020.5.31至2021.5.30</p>
<div class="policy-item-operation">
<p class="policy-item-operation-desc policy-item-operation-desc_result">
很抱歉,被保人的核保未通过
</p>
</div>
</div>
</div>
</template>
<script>
import "../index.less";
import guarantee from "@/assets/images/policy/guarantee@2x.png";
export default {
name: "InsuranceRecommend",
data() {
return {
guarantee
};
}
};
</script>
@import "../../style/index.less";
.user {
overflow: hidden;
background-color: @user-background-color;
&-info {
display: flex;
justify-content: space-between;
margin: 31px 26px 28px 28px;
height: 60px;
&-account {
display: flex;
flex-direction: column;
span:nth-child(1) {
width: 84px;
height: 40px;
line-height: 40px;
font-size: 28px;
font-weight: 600;
color: @black;
}
span:nth-child(2) {
width: 63px;
padding: 1px 0 2px;
line-height: normal;
text-align: center;
background: #000000;
border-radius: 8px;
opacity: 0.2;
font-size: @font-size-12;
font-weight: 400;
color: @user-module-background-color;
}
}
&-image {
position: relative;
width: 60px;
height: 60px;
&-certification {
position: absolute;
right: 0;
bottom: 0;
width: 20px;
height: 20px;
}
}
}
&-insurance {
display: flex;
justify-content: space-between;
align-items: center;
margin: 0 16px 10px;
padding: 0 32px;
height: 69px;
line-height: 69px;
background: @orange-light;
border-radius: @border-radius-md;
&-list {
display: flex;
height: 27px;
line-height: 27px;
&-icon {
position: relative;
margin-right: 8px;
height: 27px;
line-height: 27px;
width: 27px;
font-size: 0;
&-svg {
width: 27px;
height: 27px;
}
&-dot {
position: absolute;
top: 0;
right: 0;
width: 6px;
height: 6px;
border-radius: 100%;
background-color: @red;
}
}
&-title {
font-size: 16px;
font-weight: 600;
color: #000000;
}
}
&-divider {
height: 19px;
border-left: solid 1px #010101;
}
}
&-family {
margin: 0 16px 10px;
padding: 20px 20px 0 20px;
border-radius: @border-radius-md;
background: @user-module-background-color;
&-title {
margin: 0;
font-weight:600;
font-size: 19px;
color: #242629;
text-align: left;
}
&-info {
overflow-x: auto;
display: flex;
margin: 20px 0 24px;
&-item {
font-size: 0; // 去掉默认间距
width: 40px;
&:not(:first-child) {
margin-left: 25px;
}
&-svg {
width: 40px;
height: 40px;
}
&-name {
display: inline-block;
margin: 8px 0 6px;
width: 40px;
text-align: center;
font-size: @font-size-12;
font-weight: 600;
color: @black;
}
&-divider {
width: 40px;
height: 4px;
background: @orange-light;
border-radius: 3px;
}
&_fixed {
position: fixed;
right: 36px;
height: 71px;
background: #fff;
}
}
&::-webkit-scrollbar {
display: none;
}
}
&-insurance {
&-item {
display: flex;
align-items: center;
height: 76px;
&-middle {
display: flex;
flex-direction: column;
justify-content: space-between;
box-sizing: border-box;
margin: 0 10px 0 8px;
padding: 3px 0;
width: 169px;
.Ufii-middle-main {
margin-bottom: 6px;
font-size: 0;
text-align: left;
&-title {
margin-right: 8px;
font-size: @font-size-16;
font-weight: 600;
color: #242629;
}
&-status {
display: inline-block;
width: 44px;
height: 16px;
line-height: 16px;
text-align: center;
background: @tag-warning-light-background-color;
border-radius: 8px 2px 8px 2px;
font-size: 11px;
font-weight: 400;
color: @tag-warning-light-color;
}
}
.Ufii-middle-footer {
text-align: left;
font-size: @font-size-12;
font-weight: 400;
color: @gray-4;
line-height: 16px;
}
&_enable {
width: auto;
}
}
&-left {
width: 72px;
padding: 6px 0;
line-height: normal;
text-align: center;
background: @orange-light;
border-radius: @border-radius-sm;
font-size: @font-size-12;
font-weight: 600;
color: @black;
}
&:not(:last-child) {
border-bottom: 1px solid #EBEBEB;
}
}
}
}
&-service {
margin: 0 16px 14px;
padding: 20px 20px 0 20px;
background-color: @user-module-background-color;
border-radius: @border-radius-md;
&-title {
margin-bottom: 3px;
text-align: left;
font-size: 18px;
font-weight: 600;
color: #242629;
}
&-main {
&-item {
display: flex;
align-items: center;
padding: 0;
height: 61px;
/deep/ .cr-cell__left-icon {
margin-right: 12px;
height: auto;
line-height: normal;
.cr-icon__image {
width: 20px;
height: 20px;
}
}
/deep/ .cr-cell__title {
flex: 0 1 auto;
font-size: @font-size-16;
font-weight: 400;
color: @black;
.cr-cell__label {
display: none;
}
}
&-svg {
width: 16px;
height: 16px;
}
&:not(:last-child):after {
left: 0;
border-bottom: 1px solid #EBEBEB;
transform: scaleY(1);
}
}
}
}
&-logo {
display: flex;
flex-direction: column;
align-items: center;
margin: 0 130px 82.92px;
font-size: 0;
&-svg {
margin-bottom: 3.08px;
width: 116px;
height: 43px;
}
&-desc {
margin: 0;
width: 100px;
padding: 1px 0;
line-height: normal;
text-align: center;
background: @user-module-background-color;
border-radius: @border-radius-md;
font-size: @font-size-11;
font-weight: 400;
color: #CCCCCC;
}
}
}
<template>
<div class="user">
<div class="user-info">
<div class="user-info-account" @click="go('', true)">
<span>未登录</span>
<span>点击登录</span>
</div>
<div class="user-info-image" @click="go('', true)">
<cr-image round width="60px" height="60px" fit="cover" :src="avatar" />
<!-- <svg-icon icon-class="certification" class-name="user-info-image-certification" /> -->
</div>
</div>
<div class="user-insurance">
<div class="user-insurance-list" @click="go('/policy')">
<div class="user-insurance-list-icon">
<svg-icon icon-class="all-insurance-policy" class-name="user-insurance-list-icon-svg" />
<div class="user-insurance-list-icon-dot"></div>
</div>
<span class="user-insurance-list-title">全部保单</span>
</div>
<div class="user-insurance-divider"></div>
<div class="user-insurance-list" @click="go('', true)">
<div class="user-insurance-list-icon">
<svg-icon icon-class="claims-apply" class-name="user-insurance-list-icon-svg" />
<!-- <div class="user-insurance-list-icon-dot"></div> -->
</div>
<span class="user-insurance-list-title">申请理赔</span>
</div>
</div>
<user-family @go="go"></user-family>
<div class="user-service">
<p class="user-service-title">我的服务</p>
<div class="user-service-main" @click="go('', true)">
<cr-cell title="帮助中心" :icon="help" class="user-service-main-item">
<svg-icon slot="right-icon" icon-class="arrow" class-name="user-service-main-item-svg" />
</cr-cell>
<cr-cell title="客服电话" :icon="customerService" class="user-service-main-item">
<svg-icon slot="right-icon" icon-class="arrow" class-name="user-service-main-item-svg" />
</cr-cell>
</div>
</div>
<div class="user-logo">
<svg-icon icon-class="logo" class-name="user-logo-svg" />
<p class="user-logo-desc" @click="go('/introduction')">了解芒果保险</p>
</div>
<record-layer v-model="showLayer" desc="敬请期待"></record-layer>
<tabbar></tabbar>
</div>
</template>
<script>
import "./index.less";
import customerService from "@/assets/images/user/customer-service@1x.png";
import help from "@/assets/images/user/help@2x.png";
import avatar from "@/assets/images/user/avatar@2x.png";
import UserFamily from "./modules/UserFamily";
import Tabbar from "@/components/Tabbar";
import RecordLayer from "@/components/RecordLayer";
export default {
name: "User",
components: {
UserFamily,
Tabbar,
RecordLayer
},
data() {
return {
avatar,
customerService,
help,
isFixed: false,
showLayer: false
};
},
methods: {
go(path, isOverlay = false) {
if (isOverlay) {
this.showLayer = true;
} else {
this.$router.push(path);
}
}
}
};
</script>
<template>
<div class="user-family">
<p class="user-family-title">家庭配置保障</p>
<div class="user-family-info">
<!-- <div class="user-family-info-item">
<cr-image
round
width="40px"
height="40px"
fit="cover"
src="http://desk.fd.zol-img.com.cn/g5/M00/00/07/ChMkJ1ZqMb2IWITEAAbRDaofaNIAAGBHwO3hh0ABtEl380.jpg"
/>
<span class="user-family-info-item-name">王斌</span>
<div class="user-family-info-item-divider"></div>
</div>-->
<div
class="user-family-info-item"
:class="{ 'user-family-info-item_fixed': isFixed }"
@click="go"
>
<svg-icon icon-class="add-family" class-name="user-family-info-item-svg" />
<span class="user-family-info-item-name">添加</span>
</div>
</div>
<div class="user-family-insurance" @click="go">
<div class="user-family-insurance-item">
<cr-image round width="44px" height="44px" :src="medical" />
<div class="user-family-insurance-item-middle">
<div class="Ufii-middle-main">
<span class="Ufii-middle-main-title">国民保·百万医疗险</span>
<!-- <span class="status">保障中</span> -->
</div>
<div class="Ufii-middle-footer">看病报销医药费,最高600万</div>
</div>
<p class="user-family-insurance-item-left">开启保障</p>
</div>
<div class="user-family-insurance-item">
<cr-image round width="44px" height="44px" :src="casualty" />
<!-- user-family-insurance-item-middle_enable 保障中 -->
<div class="user-family-insurance-item-middle">
<div class="Ufii-middle-main">
<span class="Ufii-middle-main-title">国民保·百万意外险</span>
<!-- <span class="Ufii-middle-main-status">保障中</span> -->
</div>
<div class="Ufii-middle-footer">意外风险覆盖全,最高100万保额</div>
</div>
<p class="user-family-insurance-item-left">开启保障</p>
</div>
<div class="user-family-insurance-item">
<cr-image round width="44px" height="44px" :src="illness" />
<div class="user-family-insurance-item-middle">
<div class="Ufii-middle-main">
<span class="Ufii-middle-main-title">国民保·百万寿险</span>
<!-- <span class="status">保障中</span> -->
</div>
<div class="Ufii-middle-footer">最高350万保额,顶梁柱必备</div>
</div>
<p class="user-family-insurance-item-left">开启保障</p>
</div>
<div class="user-family-insurance-item">
<cr-image round width="44px" height="44px" :src="illness" />
<div class="user-family-insurance-item-middle">
<div class="Ufii-middle-main">
<span class="Ufii-middle-main-title">国民保·百万重疾险</span>
<!-- <span class="status">保障中</span> -->
</div>
<div class="Ufii-middle-footer">100种重症+40种轻症</div>
</div>
<p class="user-family-insurance-item-left">开启保障</p>
</div>
</div>
</div>
</template>
<script>
import "../index.less";
import medical from "@/assets/images/user/medical_closed@2x.png";
import casualty from "@/assets/images/user/casualty_closed@2x.png";
import illness from "@/assets/images/user/illness_closed@2x.png";
import life from "@/assets/images/user/life_closed@2x.png";
export default {
data() {
return {
medical,
casualty,
illness,
life,
isFixed: false
};
},
methods: {
go() {
this.$emit("go", "", true);
}
},
mounted() {
this.$nextTick(() => {
const offsetWidth = document.querySelector(".user-family-info").offsetWidth;
const scrollWidth = document.querySelector(".user-family-info").scrollWidth;
this.isFixed = scrollWidth > offsetWidth;
console.log(scrollWidth, offsetWidth, this.isFixed);
});
}
};
</script>
...@@ -3,11 +3,6 @@ const resolve = dir => path.join(__dirname, dir); ...@@ -3,11 +3,6 @@ const resolve = dir => path.join(__dirname, dir);
const IS_PROD = process.env.NODE_ENV === "production"; const IS_PROD = process.env.NODE_ENV === "production";
module.exports = { module.exports = {
configureWebpack: {
externals: {
vue: "Vue"
}
},
chainWebpack: config => { chainWebpack: config => {
// 修复HMR // 修复HMR
config.resolve.symlinks(true); config.resolve.symlinks(true);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment