Skip to content

M
mongo-ui
Commit 73c40489 authored by 郝聪敏's avatar 郝聪敏
Browse files
Options

Merge branch 'feature/user' into 'master' 

Feature/user

See merge request !6
parents fa1ab9ec c88b3aee
Expand all Show whitespace changes
Inline Side-by-side
Showing with 16647 additions and 168 deletions
package-lock.json 0 → 100644
View file @ 73c40489
This diff is collapsed.
package.json
View file @ 73c40489
...@@ -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"
......
public/index.html
View file @ 73c40489
...@@ -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>
......
src/assets/icons/svg/add-family.svg 0 → 100644
View file @ 73c40489
<?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
src/assets/icons/svg/all-insurance-policy.svg 0 → 100644
View file @ 73c40489
<?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
src/assets/icons/svg/arrow.svg 0 → 100644
View file @ 73c40489
<?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
src/assets/icons/svg/certification.svg 0 → 100644
View file @ 73c40489
<?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
src/assets/icons/svg/claims-apply.svg 0 → 100644
View file @ 73c40489
<?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
src/assets/icons/svg/counselor-active.svg 0 → 100644
View file @ 73c40489
<?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
src/assets/icons/svg/counselor.svg 0 → 100644
View file @ 73c40489
<?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
src/assets/icons/svg/customer-service-concat.svg 0 → 100644
View file @ 73c40489
<?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
src/assets/icons/svg/customer-service.svg 0 → 100644
View file @ 73c40489
<?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
src/assets/icons/svg/go-home.svg 0 → 100644
View file @ 73c40489
<?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
src/assets/icons/svg/help.svg 0 → 100644
View file @ 73c40489
<?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
src/assets/icons/svg/home-active.svg 0 → 100644
View file @ 73c40489
<?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
src/assets/icons/svg/home.svg 0 → 100644
View file @ 73c40489
<?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
src/assets/icons/svg/logo.svg 0 → 100644
View file @ 73c40489
This diff is collapsed.
src/assets/icons/svg/payment-record.svg 0 → 100644
View file @ 73c40489
<?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
src/assets/icons/svg/product-active.svg 0 → 100644
View file @ 73c40489
<?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
src/assets/icons/svg/product.svg 0 → 100644
View file @ 73c40489
<?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
src/assets/icons/svg/user-active.svg 0 → 100644
View file @ 73c40489
<?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
src/assets/icons/svg/user.svg 0 → 100644
View file @ 73c40489
<?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
src/components/RecordLayer.vue 0 → 100644
View file @ 73c40489
<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>
src/components/SvgIcon.vue
View file @ 73c40489
<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";
}
} }
} }
}; };
......
src/components/Tabbar.vue 0 → 100644
View file @ 73c40489
<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>
src/main.js
View file @ 73c40489
...@@ -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;
......
src/router/index.js
View file @ 73c40489
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;
src/service/cherry-ui.js
View file @ 73c40489
...@@ -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);
src/service/load.js 0 → 100644
View file @ 73c40489
/* 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
src/store/index.js
View file @ 73c40489
...@@ -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: {}
}); });
src/style/reset.less
View file @ 73c40489
...@@ -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
src/style/var.less
View file @ 73c40489
...@@ -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;
src/views/Goods/index.vue
View file @ 73c40489
...@@ -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 {
......
src/views/Goods/inform.vue
View file @ 73c40489
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
为保证被保险人的保险权益在理赔时不受影响，请确认被保险人健康状况是否符合以下投保条件： 为保证被保险人的保险权益在理赔时不受影响，请确认被保险人健康状况是否符合以下投保条件：
</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> 是否有以下情形之一
...@@ -30,19 +30,29 @@ ...@@ -30,19 +30,29 @@
<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;
} }
} }
}; };
......
src/views/Goods/modules/AiTestTip.vue
View file @ 73c40489
...@@ -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;
......
src/views/Introduction/index.less 0 → 100644
View file @ 73c40489
@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;
}
}
}
}
}
src/views/Introduction/index.vue 0 → 100644
View file @ 73c40489
<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>
src/views/Introduction/modules/BusinessQuali.vue 0 → 100644
View file @ 73c40489
<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>
src/views/Introduction/modules/Company.vue 0 → 100644
View file @ 73c40489
<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>
src/views/Introduction/modules/Product.vue 0 → 100644
View file @ 73c40489
<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>
src/views/Policy/Detail/index.less 0 → 100644
View file @ 73c40489
.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
src/views/Policy/Detail/index.vue 0 → 100644
View file @ 73c40489
<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>
src/views/Policy/index.less 0 → 100644
View file @ 73c40489
@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;
}
}
}
src/views/Policy/index.vue 0 → 100644
View file @ 73c40489
<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>
src/views/Policy/modules/InsuranceRecommend.vue 0 → 100644
View file @ 73c40489
<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>
src/views/Policy/modules/PolicyItem.vue 0 → 100644
View file @ 73c40489
<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>
src/views/User/index.less 0 → 100644
View file @ 73c40489
@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;
}
}
}
src/views/User/index.vue 0 → 100644
View file @ 73c40489
<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>
src/views/User/modules/UserFamily.vue 0 → 100644
View file @ 73c40489
<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>
vue.config.js
View file @ 73c40489
...@@ -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