Skip to content

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

Merge branch 'feature/run_process' into 'master' 

Feature/run process

See merge request !36
parents 9a3cc7ef a4bfd397
Hide whitespace changes
Inline Side-by-side
Showing with 1329 additions and 662 deletions
package-lock.json
View file @ e9d11fea
......@@ -1206,8 +1206,7 @@
"@types/json-schema": {
"version": "7.0.5",
"resolved": "http://npmprivate.quantgroups.com/@types%2fjson-schema/-/json-schema-7.0.5.tgz",
"integrity": "sha512-7+2BITlgjgDhH0vvwZU/HZJVyk+2XUlvxXe8dFMedNX/aMkaOq++rMAFXc0tM7ij15QaWlbdQASBR9dihi+bDQ==",
"dev": true
"integrity": "sha512-7+2BITlgjgDhH0vvwZU/HZJVyk+2XUlvxXe8dFMedNX/aMkaOq++rMAFXc0tM7ij15QaWlbdQASBR9dihi+bDQ=="
},
"@types/minimatch": {
"version": "3.0.3",
......@@ -1924,7 +1923,6 @@
"version": "6.12.3",
"resolved": "http://npmprivate.quantgroups.com/ajv/-/ajv-6.12.3.tgz",
"integrity": "sha512-4K0cK3L1hsqk9xIb2z9vs/XU+PGJZ9PNpJRDS9YLzmNdX6jmVPfamLvTJr0aDAusnHyCHO6MjzlkAsgtqp9teA==",
"dev": true,
"requires": {
"fast-deep-equal": "^3.1.1",
"fast-json-stable-stringify": "^2.0.0",
......@@ -1941,8 +1939,7 @@
"ajv-keywords": {
"version": "3.5.1",
"resolved": "http://npmprivate.quantgroups.com/ajv-keywords/-/ajv-keywords-3.5.1.tgz",
"integrity": "sha512-KWcq3xN8fDjSB+IMoh2VaXVhRI0BBGxoYp3rx7Pkb6z0cFjYR9Q9l4yZqqals0/zsioCmocC5H6UvsGD4MoIBA==",
"dev": true
"integrity": "sha512-KWcq3xN8fDjSB+IMoh2VaXVhRI0BBGxoYp3rx7Pkb6z0cFjYR9Q9l4yZqqals0/zsioCmocC5H6UvsGD4MoIBA=="
},
"alphanum-sort": {
"version": "1.0.2",
......@@ -2215,6 +2212,37 @@
"integrity": "sha512-3YDiu347mtVtjpyV3u5kVqQLP242c06zwDOgpeRnybmXlYYsLbtTrUBUm8i8srONt+FWobl5aibnU1030PeeuA==",
"dev": true
},
"axios": {
"version": "0.19.2",
"resolved": "http://npmprivate.quantgroups.com/axios/-/axios-0.19.2.tgz",
"integrity": "sha512-fjgm5MvRHLhx+osE2xoekY70AhARk3a6hkN+3Io1jc00jtquGvxYlKlsFUhmUET0V5te6CcZI7lcv2Ym61mjHA==",
"requires": {
"follow-redirects": "1.5.10"
},
"dependencies": {
"debug": {
"version": "3.1.0",
"resolved": "http://npmprivate.quantgroups.com/debug/-/debug-3.1.0.tgz",
"integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
"requires": {
"ms": "2.0.0"
}
},
"follow-redirects": {
"version": "1.5.10",
"resolved": "http://npmprivate.quantgroups.com/follow-redirects/-/follow-redirects-1.5.10.tgz",
"integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
"requires": {
"debug": "=3.1.0"
}
},
"ms": {
"version": "2.0.0",
"resolved": "http://npmprivate.quantgroups.com/ms/-/ms-2.0.0.tgz",
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
}
}
},
"babel-eslint": {
"version": "10.1.0",
"resolved": "http://npmprivate.quantgroups.com/babel-eslint/-/babel-eslint-10.1.0.tgz",
......@@ -2251,6 +2279,11 @@
"object.assign": "^4.1.0"
}
},
"babel-plugin-syntax-dynamic-import": {
"version": "6.18.0",
"resolved": "http://npmprivate.quantgroups.com/babel-plugin-syntax-dynamic-import/-/babel-plugin-syntax-dynamic-import-6.18.0.tgz",
"integrity": "sha1-jWomIpyDdFqZgqRBBRVyyqF5sdo="
},
"babel-runtime": {
"version": "6.26.0",
"resolved": "http://npmprivate.quantgroups.com/babel-runtime/-/babel-runtime-6.26.0.tgz",
......@@ -2369,8 +2402,7 @@
"big.js": {
"version": "5.2.2",
"resolved": "http://npmprivate.quantgroups.com/big.js/-/big.js-5.2.2.tgz",
"integrity": "sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==",
"dev": true
"integrity": "sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ=="
},
"binary-extensions": {
"version": "2.1.0",
......@@ -4456,8 +4488,7 @@
"emojis-list": {
"version": "3.0.0",
"resolved": "http://npmprivate.quantgroups.com/emojis-list/-/emojis-list-3.0.0.tgz",
"integrity": "sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==",
"dev": true
"integrity": "sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q=="
},
"encodeurl": {
"version": "1.0.2",
......@@ -5109,8 +5140,7 @@
"fast-deep-equal": {
"version": "3.1.3",
"resolved": "http://npmprivate.quantgroups.com/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
"integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
"dev": true
"integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="
},
"fast-diff": {
"version": "1.2.0",
......@@ -5158,8 +5188,7 @@
"fast-json-stable-stringify": {
"version": "2.1.0",
"resolved": "http://npmprivate.quantgroups.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz",
"integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==",
"dev": true
"integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw=="
},
"fast-levenshtein": {
"version": "2.0.6",
......@@ -6836,8 +6865,7 @@
"json-schema-traverse": {
"version": "0.4.1",
"resolved": "http://npmprivate.quantgroups.com/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
"integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
"dev": true
"integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg=="
},
"json-stable-stringify-without-jsonify": {
"version": "1.0.1",
......@@ -6861,7 +6889,6 @@
"version": "2.1.3",
"resolved": "http://npmprivate.quantgroups.com/json5/-/json5-2.1.3.tgz",
"integrity": "sha512-KXPvOm8K9IJKFM0bmdn8QXh7udDh1g/giieX0NLCaMnb4hEiVFqnop2ImTXCc5e0/oHz3LTqmHGtExn5hfMkOA==",
"dev": true,
"requires": {
"minimist": "^1.2.5"
}
......@@ -7403,7 +7430,6 @@
"version": "1.4.0",
"resolved": "http://npmprivate.quantgroups.com/loader-utils/-/loader-utils-1.4.0.tgz",
"integrity": "sha512-qH0WSMBtn/oHuwjy/NucEgbx5dbxxnxup9s4PVXJUDHZBQY+s0NWA9rJf53RBnQZxfch7euUui7hpoAPvALZdA==",
"dev": true,
"requires": {
"big.js": "^5.2.2",
"emojis-list": "^3.0.0",
......@@ -7414,7 +7440,6 @@
"version": "1.0.1",
"resolved": "http://npmprivate.quantgroups.com/json5/-/json5-1.0.1.tgz",
"integrity": "sha512-aKS4WQjPenRxiQsC93MNfjx+nbF4PAdYzmd/1JIj8HYzqfbu86beTuNgXDzPknWk0n0uARlyewZo4s++ES36Ow==",
"dev": true,
"requires": {
"minimist": "^1.2.0"
}
......@@ -7836,8 +7861,7 @@
"minimist": {
"version": "1.2.5",
"resolved": "http://npmprivate.quantgroups.com/minimist/-/minimist-1.2.5.tgz",
"integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==",
"dev": true
"integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw=="
},
"minipass": {
"version": "3.1.3",
......@@ -8154,11 +8178,6 @@
"integrity": "sha512-U+JJi7duF1o+u2pynbp2zXDW2/PADgC30f0GsHZtRh+HOcXHnw137TrNlyxxRvWW5fjKd3bcLHPxofWuCjaeZg==",
"dev": true
},
"normalize.css": {
"version": "8.0.1",
"resolved": "http://npmprivate.quantgroups.com/normalize.css/-/normalize.css-8.0.1.tgz",
"integrity": "sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg=="
},
"npm-run-path": {
"version": "2.0.2",
"resolved": "http://npmprivate.quantgroups.com/npm-run-path/-/npm-run-path-2.0.2.tgz",
......@@ -8657,6 +8676,11 @@
"sha.js": "^2.4.8"
}
},
"pdfjs-dist": {
"version": "2.5.207",
"resolved": "http://npmprivate.quantgroups.com/pdfjs-dist/-/pdfjs-dist-2.5.207.tgz",
"integrity": "sha512-xGDUhnCYPfHy+unMXCLCJtlpZaaZ17Ew3WIL0tnSgKFUZXHAPD49GO9xScyszSsQMoutNDgRb+rfBXIaX/lJbw=="
},
"performance-now": {
"version": "2.1.0",
"resolved": "http://npmprivate.quantgroups.com/performance-now/-/performance-now-2.1.0.tgz",
......@@ -9624,8 +9648,7 @@
"punycode": {
"version": "2.1.1",
"resolved": "http://npmprivate.quantgroups.com/punycode/-/punycode-2.1.1.tgz",
"integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==",
"dev": true
"integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A=="
},
"px2rem": {
"version": "0.5.0",
......@@ -9812,6 +9835,27 @@
"unpipe": "1.0.0"
}
},
"raw-loader": {
"version": "4.0.1",
"resolved": "http://npmprivate.quantgroups.com/raw-loader/-/raw-loader-4.0.1.tgz",
"integrity": "sha512-baolhQBSi3iNh1cglJjA0mYzga+wePk7vdEX//1dTFd+v4TsQlQE0jitJSNF1OIP82rdYulH7otaVmdlDaJ64A==",
"requires": {
"loader-utils": "^2.0.0",
"schema-utils": "^2.6.5"
},
"dependencies": {
"loader-utils": {
"version": "2.0.0",
"resolved": "http://npmprivate.quantgroups.com/loader-utils/-/loader-utils-2.0.0.tgz",
"integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==",
"requires": {
"big.js": "^5.2.2",
"emojis-list": "^3.0.0",
"json5": "^2.1.2"
}
}
}
},
"read-pkg": {
"version": "5.2.0",
"resolved": "http://npmprivate.quantgroups.com/read-pkg/-/read-pkg-5.2.0.tgz",
......@@ -10208,7 +10252,6 @@
"version": "2.7.0",
"resolved": "http://npmprivate.quantgroups.com/schema-utils/-/schema-utils-2.7.0.tgz",
"integrity": "sha512-0ilKFI6QQF5nxDZLFn2dMjvc4hjg/Wkg7rHd3jK6/A4a1Hl9VFdQWvgB1UMGoU94pad1P/8N7fMcEnLnSiju8A==",
"dev": true,
"requires": {
"@types/json-schema": "^7.0.4",
"ajv": "^6.12.2",
......@@ -11839,7 +11882,6 @@
"version": "4.2.2",
"resolved": "http://npmprivate.quantgroups.com/uri-js/-/uri-js-4.2.2.tgz",
"integrity": "sha512-KY9Frmirql91X2Qgjry0Wd4Y+YTdrdZheS8TFwvkbLWf/G5KNJDCh6pKL5OZctEW4+0Baa5idK2ZQuELRwPznQ==",
"dev": true,
"requires": {
"punycode": "^2.1.0"
}
......@@ -12065,6 +12107,24 @@
}
}
},
"vue-pdf": {
"version": "4.1.0",
"resolved": "http://npmprivate.quantgroups.com/vue-pdf/-/vue-pdf-4.1.0.tgz",
"integrity": "sha512-kjDmCJplCtf5+qQv6uMuUoh01AsoyKNsawHtfi9x739f1sTxdIwrLu25g+EhfRdtjh6JBqW46Mff1wijKa79wA==",
"requires": {
"babel-plugin-syntax-dynamic-import": "^6.18.0",
"loader-utils": "^1.4.0",
"pdfjs-dist": "^2.5.207",
"raw-loader": "^4.0.1",
"vue-resize-sensor": "^2.0.0",
"worker-loader": "^2.0.0"
}
},
"vue-resize-sensor": {
"version": "2.0.0",
"resolved": "http://npmprivate.quantgroups.com/vue-resize-sensor/-/vue-resize-sensor-2.0.0.tgz",
"integrity": "sha512-W+y2EAI/BxS4Vlcca9scQv8ifeBFck56DRtSwWJ2H4Cw1GLNUYxiZxUHHkuzuI5JPW/cYtL1bPO5xPyEXx4LmQ=="
},
"vue-router": {
"version": "3.3.4",
"resolved": "http://npmprivate.quantgroups.com/vue-router/-/vue-router-3.3.4.tgz",
......@@ -13972,6 +14032,26 @@
"errno": "~0.1.7"
}
},
"worker-loader": {
"version": "2.0.0",
"resolved": "http://npmprivate.quantgroups.com/worker-loader/-/worker-loader-2.0.0.tgz",
"integrity": "sha512-tnvNp4K3KQOpfRnD20m8xltE3eWh89Ye+5oj7wXEEHKac1P4oZ6p9oTj8/8ExqoSBnk9nu5Pr4nKfQ1hn2APJw==",
"requires": {
"loader-utils": "^1.0.0",
"schema-utils": "^0.4.0"
},
"dependencies": {
"schema-utils": {
"version": "0.4.7",
"resolved": "http://npmprivate.quantgroups.com/schema-utils/-/schema-utils-0.4.7.tgz",
"integrity": "sha512-v/iwU6wvwGK8HbU9yi3/nhGzP0yGSuhQMzL6ySiec1FSrZZDkhm4noOSWzrNFo/jEc+SJY6jRTwuwbSXJPDUnQ==",
"requires": {
"ajv": "^6.1.0",
"ajv-keywords": "^3.1.0"
}
}
}
},
"wrap-ansi": {
"version": "6.2.0",
"resolved": "http://npmprivate.quantgroups.com/wrap-ansi/-/wrap-ansi-6.2.0.tgz",
......
src/App.vue
View file @ e9d11fea
<template>
<div id="app">
<router-view />
<div class="loading-container" v-show="isLoading">
<div class="loading-container" v-if="isLoading">
<cr-loading class="loading" size="24px">加载中...</cr-loading>
</div>
<login-modal />
......@@ -30,6 +30,7 @@ export default {
</script>
<style lang="less" scoped>
@import "./style/index.less";
.loading-container {
position: fixed;
left: 0;
......
src/api/goodsList.mock.js
View file @ e9d11fea
......@@ -28,7 +28,12 @@ export default [
icon: medical,
guarantee_title: "医疗保障",
guarantee_sub: "看病报销医药费,最高600万",
compony: "泰康在线"
company: "泰康在线",
payType: [
{ label: "月缴", value: "1" },
{ label: "一次交清", value: "2" }
],
policyPeriod: []
},
{
id: "HTDQZJX001",
......@@ -46,7 +51,12 @@ export default [
icon: illness,
guarantee_title: "重疾保障",
guarantee_sub: "100种重症+40种轻症",
compony: "华泰财险"
company: "华泰财险",
payType: [
{ label: "月缴", value: "1" },
{ label: "一次交清", value: "2" }
],
policyPeriod: []
},
{
id: "BNZJX001",
......@@ -65,7 +75,12 @@ export default [
icon: illness,
guarantee_title: "重疾保障",
guarantee_sub: "100种重症+40种轻症",
compony: "华泰财险"
company: "华泰财险",
payType: [{ label: "年缴", value: "1" }],
policyPeriod: [
{ label: "保至70周岁", value: "1" },
{ label: "保至终身", value: "2" }
]
},
{
id: "ZAYWX001",
......@@ -83,7 +98,9 @@ export default [
icon: casualty,
guarantee_title: "意外保障",
guarantee_sub: "意外风险覆盖全,最高100万保额",
compony: "众安保险"
company: "众安保险",
payType: [],
policyPeriod: []
},
{
id: "HGSX001",
......@@ -101,6 +118,15 @@ export default [
icon: life,
guarantee_title: "人寿保障",
guarantee_sub: "最高350万保额,顶梁柱必备",
compony: "华泰财险"
company: "华泰财险",
payType: [{ label: "年缴", value: "1" }],
policyPeriod: [
{ label: "10年", value: "1" },
{ label: "20年", value: "2" },
{ label: "30年", value: "3" },
{ label: "保至60周岁", value: "4" },
{ label: "保至65周岁", value: "5" },
{ label: "保至70周岁", value: "6" }
]
}
];
src/api/policy.js
View file @ e9d11fea
......@@ -9,3 +9,18 @@ export const getPolicyList = () => {
export const getPolicyDetail = orderNo => {
return req.get(`/policy_order/detail?orderNo=${orderNo}`);
};
// 查询订单详情(购买成功页面使用)
export const getGenPolicyDetail = orderNo => {
return req.get(`/policy_order/general?orderNo=${orderNo}`);
};
// 查询缴费记录
export const getPayRecord = policySecId => {
return req.get(`/policy/pay_record?policySecId=${policySecId}`);
};
// 保单自动续保状态管理
export const updateRenewal = (policySecId, status) => {
return req.post(`/auto_renew_policy/${policySecId}/${status}`);
};
src/api/user.js
View file @ e9d11fea
......@@ -27,7 +27,7 @@ export const getCaptchaImg = param => {
// 获取用户信息
export const getUserInfo = () => {
return req.get("user/me");
return req.get("/user/info/me");
};
// 查询家人列表
......
src/components/LoginModal.vue
View file @ e9d11fea
......@@ -90,7 +90,7 @@ export default {
this.formData.openId = localStorage.getItem("openId") || null;
const res = await loginByPhone(this.formData);
if (res) {
this.$notify("登录成功");
this.$notify({ type: "success", message: "登录成功" });
this.setIsShowLogin(false);
// localStorage.setItem("mongoToken", res.token);
// TODO 开发目前使用这个token
......
src/mixins/formValidate.mixin.js
View file @ e9d11fea
import cherry from "@qg/cherry-ui";
const { Notify } = cherry;
export default {
methods: {
onFailed(errorInfo) {
Notify(errorInfo?.errors?.[0]?.message || "校验失败");
this.$notify({ type: "warning", message: errorInfo?.errors?.[0]?.message || "校验失败" });
}
}
};
src/router/routes.js
View file @ e9d11fea
......@@ -90,7 +90,7 @@ export default [
component: () => import("../views/Policy/VirtualDetail/index.vue")
},
{
path: "/policy/success",
path: "/policy/success/:orderNo",
name: "Sucess",
component: () => import("../views/Policy/Success/index.vue")
},
......@@ -100,14 +100,14 @@ export default [
component: () => import("../views/Policy/Add/index.vue")
},
{
path: "/policy/payment-record",
name: "PaymentRecord",
component: () => import("../views/Policy/PaymentRecord/index.vue")
path: "/policy/renewal/:orderNo/:policySecId",
name: "Renewal",
component: () => import("../views/Policy/Renewal/index.vue")
},
{
path: "/policy/renewal",
path: "/policy/payment-record/:policySecId/:status",
name: "Renewal",
component: () => import("../views/Policy/Renewal/index.vue")
component: () => import("../views/Policy/PaymentRecord/index.vue")
},
{
path: "/introduction",
......
src/store/modules/user.js
View file @ e9d11fea
import GOODS_LIST from "@/api/goodsList.mock";
import { getUserInfo, getFamilyList } from "@/api/user";
import { getPolicyList } from "@/api/policy";
import man from "@/assets/images/user/man@2x.png";
import woman from "@/assets/images/user/woman@2x.png";
import avatar from "@/assets/images/user/avatar@2x.png";
import _ from "lodash";
const CONSTANT = {
avatar: {
man: "../../../assets/images/user/man@2x.png",
woman: "../../../assets/images/user/woman@2x.png"
man,
woman
},
relation: ["本人", "父母", "配偶", "子女"]
};
// 0: man; 1: woman
function getReletion(relation, gender) {
let result = "";
if ([1, 3].includes(+relation)) {
if (+relation === 1) {
result = +gender ? "父亲" : "母亲";
result = +gender ? "母亲" : "父亲";
} else {
result = +gender ? "儿子" : "女儿";
result = +gender ? "女儿" : "儿子";
}
} else {
result = CONSTANT.relation[+relation];
......@@ -33,7 +37,7 @@ export default {
userInfo: {
name: "未登录",
phoneNoMask: "点击登录",
avatar: "../../assets/images/user/avatar@2x.png",
avatar,
auth: false
}
},
......@@ -63,10 +67,11 @@ export default {
const policyListFilted = policyList
.filter(
policy =>
_.some(goodsList, { id: +policy.productNo }) &&
+family.userInfoSecId === +policy.insuredUserSecId
_.some(goodsList, { id: policy.productNo }) &&
+family.userInfoSecId === +policy.insuredUserSecId &&
["6.1", "6.2", "6.3"].includes(policy.policyState)
)
.map(policy => ({ ...policy, ..._.find(goodsList, { id: +policy.productNo }) }))
.map(policy => ({ ...policy, ..._.find(goodsList, { id: policy.productNo }) }))
.sort((a, b) => a.termType > b.termType);
return policyListFilted?.[0] || goodsList[0];
......
src/views/Goods/Inform/index.vue
View file @ e9d11fea
......@@ -39,8 +39,9 @@ export default {
},
methods: {
conform() {
this.generateFormData();
this.generateOrder();
this.$router.push(`/policy/detail/123`);
// this.generateFormData();
// this.generateOrder();
},
generateFormData() {
const {
......
src/views/Home/Activity/index.less
View file @ e9d11fea
......@@ -66,6 +66,7 @@
&-prize {
margin: 20px 7px;
width: 362px;
height: 362px;
background: url('../../../assets/images/home/zhuanpan.png') no-repeat 0 0 /contain;
......@@ -177,7 +178,7 @@
flex-direction: column;
justify-content: center;
align-items: center;
margin: 0 10px 24px;
margin: 0 20px 24px;
height: 139px;
background: url('../../../assets/images/home/jiangpin.png') no-repeat 0 0 /contain;
......
src/views/Home/Activity/index.vue
View file @ e9d11fea
......@@ -97,6 +97,7 @@
</template>
<script>
import Modal from "../modules/Modal";
import localStorage from "@/service/localStorage";
export default {
name: "Activity",
......@@ -106,6 +107,7 @@ export default {
data() {
return {
isGoing: false,
isLogin: localStorage.get("mongoToken"),
modal: {
winning: false,
guide: false,
......@@ -114,7 +116,16 @@ export default {
}
};
},
computed: {},
computed: {
voteButtonText() {
if (!this.isLogin) {
return "去投票";
}
}
},
created() {
},
methods: {
gameStart() {
this.$nextTick(() => {
......@@ -125,7 +136,7 @@ export default {
const pointer = document.querySelector(".activity-prize-pointer");
// 1. 计算旋转角度
let rotateItemDeg = (3 * 360) / 6; // 每个item旋转角度, 第一个不用旋转
let rotate = rotateItemDeg + 5 * 360;
let rotate = rotateItemDeg + 4 * 360;
let rotateSpeed = ((rotateItemDeg / 360) * 1 + 5).toFixed(2);
// 2. 重置转盘样式
turntable.removeAttribute("style");
......
src/views/Home/index.less
View file @ e9d11fea
......@@ -174,14 +174,13 @@
height: 30px;
background: #FFFFFF;
&.active {
opacity: 0.4;
background:rgba(255,255,255,.4);
}
&:nth-child(3) {
border-radius: 20px 0 0 20px;
}
&:nth-child(4) {
// opacity: 0.4;
border-radius: 0 20px 20px 0;
}
......
src/views/Policy/Detail/Types/Guarantee.vue
View file @ e9d11fea
<template>
<div>
<status-desc
:firstTitle="data.cardConfig.detailText"
:secondTitle="data.cardConfig.statusText"
:recordText="data.cardConfig.recordText"
></status-desc>
<status-desc :cardConfig="data.cardConfig" :policySecId="data.policySecId"></status-desc>
<pay-cost
v-if="showPayCost"
:statusKey="data.cardConfig.key"
:payCostConfig="data.cardConfig.payCostConfig"
:day="data.payInfo && data.payInfo.expiredDay"
:payInfo="payInfo"
></pay-cost>
<insurance-card
:productNo="data.productNo"
:policySecId="data.policySecId"
:autoRenewPremium="data.autoRenewPremium"
:policyNo="data.policyNo"
:orderNo="data.orderNo"
></insurance-card>
<security-content :data="data" :detail="planDetail"></security-content>
<insurance-service :detail="qaDetail"></insurance-service>
......@@ -29,6 +29,7 @@ import InsuranceService from "../modules/InsuranceService";
import PayCost from "../modules/PayCost";
import StatusDesc from "../modules/StatusDesc";
import CustomerService from "../modules/CustomerService";
import detailPayMixin from "@/views/Policy/mixin/orderInfo.mixin";
import ciiDetail from "@/api/detail.huatai.zhongjixian";
import liDetail from "@/api/detail.huagui.shouxian";
......@@ -37,6 +38,7 @@ import aiDetail from "@/api/detail.zhongan.yiwai";
export default {
name: "Guarantee",
mixins: [detailPayMixin],
components: {
InsuranceRecommend,
InsuranceCard,
......@@ -59,6 +61,7 @@ export default {
},
watch: {
data: {
immediate: true,
deep: true,
handler() {
this.setProductInfoByNo();
......
src/views/Policy/Detail/Types/Refund.vue
View file @ e9d11fea
<template>
<div>
<status-desc
:firstTitle="data.cardConfig.detailText"
:secondTitle="data.cardConfig.statusText"
:recordText="data.cardConfig.recordText"
></status-desc>
<status-desc :cardConfig="data.cardConfig" :policySecId="data.policySecId"></status-desc>
<pay-cost
v-if="showPayCost"
:statusKey="data.cardConfig.key"
:payCostConfig="data.cardConfig.payCostConfig"
:payInfo="payInfo"
></pay-cost>
<refund
v-else
:refundConfig="data.cardConfig.refundConfig"
:amount="amount"
:payTime="payTime"
:payTimeText="payTimeText"
></refund>
<Phone></Phone>
</div>
......@@ -24,10 +22,12 @@ import StatusDesc from "../modules/StatusDesc";
import Phone from "../modules/Phone";
import Refund from "../modules/Refund";
import PayCost from "../modules/PayCost";
import { parseTime } from "@/service/utils";
import detailPayMixin from "@/views/Policy/mixin/orderInfo.mixin";
// import { parseTime } from "@/service/utils";
export default {
name: "Guarantee",
mixins: [detailPayMixin],
components: {
StatusDesc,
Phone,
......@@ -45,10 +45,16 @@ export default {
},
computed: {
amount() {
return this.data.cardConfig?.amount || 0;
console.log(this.data);
return this.data.refundInfo?.amount || 0;
},
payTime() {
return parseTime(this.data.cardConfig?.payTime, "{y}-{m}-{d}") || 0;
return this.data.cardConfig.key === "8"
? this.data.refundInfo?.refundTime || "-"
: this.data.refundInfo?.payTime || "-";
},
payTimeText() {
return this.data.cardConfig.key === "8" ? "到账时间" : "支付时间";
},
showPayCost() {
return ["4", "14", "13"].includes(this.data?.cardConfig?.key);
......
src/views/Policy/Detail/index.less
View file @ e9d11fea
.button() {
height: 28px;
border-radius: 8px !important;
border: 1px solid #787EFF !important;
border-radius: 8px !important;
border: 1px solid #787EFF !important;
font-size: 14px;
font-weight: 400;
color: #787EFF !important;
line-height: 16px;
background-color: #fff !important;
&:first-child {
margin-right: 8px;
margin-right: 8px;
}
}
.card-container() {
margin: 0 16px 10px;
padding: 20px;
background: #FFFFFF;
box-shadow: 0px 5px 25px 0px rgba(0,0,0,0.07);
box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.07);
border-radius: 14px;
}
.card-title(@marginBottom) {
margin-bottom: @marginBottom;
font-size: 18px;
......@@ -25,6 +28,7 @@
color: #242629;
line-height: 24px;
}
.card-desc(@marginBottom, @lineHeight: 16px) {
margin-bottom: @marginBottom;
font-size: 12px;
......@@ -32,328 +36,426 @@
color: #999999;
line-height: @lineHeight;
}
.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;
font-size: 18px;
font-weight: 600;
color: #242629;
line-height: 24px;
}
span:last-child {
font-size: 12px;
font-size: 12px;
font-weight: 400;
color: #787EFF;
line-height: 24px;
}
.svg-icon {
padding: 4px 0;
width: 16px;
height: 16px;
padding: 4px 0;
width: 16px;
height: 16px;
}
}
.card-body(@marginBottom: 0) {
margin-bottom: @marginBottom;
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;
}
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;
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%);
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;
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;
// padding-bottom: 49px;
.Pdb-status {
margin: 0 0 5px 20px;
font-size: 28px;
font-weight: 600;
color: #333333;
line-height: 40px;
&:first-child {
margin: 32px 0 0 20px;
}
}
.Pdb-tips {
display: inline-flex;
align-items: center;
justify-content: center;
margin: 0 0 24px 20px;
padding: 0 4px;
width: auto;
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-refund {
.card-container();
margin: 27px 16px 10px;
&-title {
.card-title(8px);
}
&-desc {
.card-desc(24px);
}
&-content {
.Pdbr-content-item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 16px;
height: 50px;
background: #F6F7FA;
border-radius: 8px;
&:first-child {
margin-bottom: 12px;
}
span:first-child {
font-size: 14px;
font-weight: 400;
color: #666666;
line-height: 24px;
}
span:last-child {
font-size: 14px;
font-weight: 500;
color: #333333;
line-height: 24px;
}
}
}
}
.Pdb-payment {
.card-container();
&-title {
.card-title(16px);
&_tips {
font-size: 14px;
font-weight: 400;
color: #999999;
line-height: 16px;
}
}
&-content {
margin-bottom: 17px;
.Pdbp-content-item {
display: flex;
align-items: center;
.Pdbpc-item-svg {
margin-right: 8px;
width: 12px;
height: 12px;
border-radius: 50%;
background: #FFC842;
}
.Pdbpc-item-text {
.card-desc(0, 24px);
}
}
}
&-button {
width: 100%;
height: 52px;
background: #FFC842 !important;
border-radius: 14px !important;
font-size: 16px;
font-weight: 600;
color: #333333;
line-height: 22px;
}
}
.Pdb-insurance {
.card-container();
&-name {
.card-title(12px);
}
&-no {
.card-desc(16px);
}
&-operation {
.Pdbi-operation-button { .button }
}
}
.Pdb-content {
.card-container();
&-head {
.card-head
}
&-body {
.card-body(8px);
}
&-operation {
.Pdbc-button { .button }
}
&-user {
margin-top: 24px;
.Pdbc-user-who {
.card-title(16px);
}
.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;
}
}
}
}
.Pdb-service {
.card-container();
margin: 0 16px 16px;
padding: 20px 20px 11px;
&-head {
.card-head();
position: absolute;
left: 0;
right: 0;
// padding-bottom: 49px;
.Pdb-status {
margin: 0 0 5px 20px;
font-size: 28px;
font-weight: 600;
color: #333333;
line-height: 40px;
&:first-child {
margin: 32px 0 0 20px;
}
}
.Pdb-tips {
display: inline-flex;
align-items: center;
justify-content: center;
margin: 0 0 24px 20px;
padding: 0 4px;
width: auto;
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-refund {
.card-container();
margin: 27px 16px 10px;
&-title {
.card-title(8px);
}
&-desc {
.card-desc(24px);
}
&-note {
.card-desc(0);
margin-top: 16px;
}
&-operation {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 16px;
width: 100%;
.Pdbi-operation-button {
padding: 0 !important;
width: 146px;
height: 40px;
border-radius: 8px !important;
border: 1px solid #787EFF !important;
background-color: #fff !important;
font-size: 14px;
font-weight: 400;
color: #787EFF !important;
line-height: 16px;
&_paid {
border: 0 !important;
background: #F4F5FF !important;
color: #787EFF !important;
}
}
}
&-content {
.Pdbr-content-item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 16px;
height: 50px;
background: #F6F7FA;
border-radius: 8px;
&:first-child {
margin-bottom: 12px;
}
span:first-child {
font-size: 14px;
font-weight: 400;
color: #666666;
line-height: 24px;
}
span:last-child {
font-size: 14px;
font-weight: 500;
color: #333333;
line-height: 24px;
}
}
}
}
.Pdb-payment {
.card-container();
&-title {
.card-title(16px);
&_tips {
font-size: 14px;
font-weight: 400;
color: #999999;
line-height: 16px;
}
}
&-content {
margin-bottom: 17px;
.Pdbp-content-item {
display: flex;
align-items: center;
.Pdbpc-item-svg {
margin-right: 8px;
width: 12px;
height: 12px;
border-radius: 50%;
background: #FFC842;
}
.Pdbpc-item-text {
.card-desc(0, 24px);
}
}
}
&-body {
.card-body();
}
&-question {
// margin-top: 24px;
.card-head();
}
&-divider {
margin: 0 0 12px 0;
&:before {
height: 1px;
border-color: #EBEBEB;
}
}
&-agreement {
display: flex;
padding-top: 3px;
align-items: center;
flex-wrap: wrap;
a {
font-size: 12px;
color: #333;
&::after {
display: inline-block;
content: " ";
width: 0;
height: 12px;
border-right: 1px #333 solid;
margin: 0 5px;
vertical-align: -2px;
}
&:last-child::after {
display: none;
}
}
}
}
.Pdb-operation {
display: flex;
justify-content: space-around;
margin-bottom: 14px;
&-item {
display: flex;
justify-content: space-between;
align-items: center;
width: 84px;
.Pdbo-item-svg {
width: 16px;
height: 16px;
}
.Pdbo-item-text {
font-size: 14px;
font-weight: 400;
color: #999999;
line-height: 20px;
}
}
}
.Pdb-footer {
display: flex;
flex-direction: column;
align-items: center;
margin: 231px 0 20px;
span:first-child {
margin-bottom: 2px;
font-size: 11px;
font-weight: 400;
color: #999999;
line-height: 16px;
}
span:last-child {
font-size: 20px;
font-weight: 600;
color: #666666;
line-height: 28px;
}
}
.Pdb-recommend {
margin-bottom: 49px;
}
&-button {
width: 100%;
height: 52px;
background: #FFC842 !important;
border-radius: 14px !important;
font-size: 16px;
font-weight: 600;
color: #333333;
line-height: 22px;
}
}
.Pdb-insurance {
.card-container();
&-name {
.card-title(12px);
}
&-no {
.card-desc(16px);
}
&-operation {
.Pdbi-operation-button {
.button
}
}
}
.Pdb-content {
.card-container();
&-head {
.card-head
}
&-body {
.card-body(8px);
}
&-operation {
.Pdbc-button {
.button
}
}
&-user {
margin-top: 24px;
.Pdbc-user-who {
.card-title(16px);
}
.Pdbc-user-info {
display: flex;
// justify-content: space-around;
box-sizing: border-box;
padding: 0 16px;
align-items: center;
width: 100%;
height: 50px;
background: #F6F7FA;
border-radius: 14px;
span:first-child {
width: 55px;
font-size: 14px;
font-weight: 500;
color: #333333;
line-height: 24px;
}
span:last-child {
// flex: 1;
font-size: 14px;
font-weight: 400;
color: #666666;
line-height: 24px;
}
}
}
}
.Pdb-service {
.card-container();
margin: 0 16px 16px;
padding: 20px 20px 11px;
&-head {
.card-head();
}
&-body {
.card-body();
}
&-question {
// margin-top: 24px;
.card-head();
}
&-divider {
margin: 0 0 12px 0;
&:before {
height: 1px;
border-color: #EBEBEB;
}
}
&-agreement {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
a {
font-size: 12px;
color: #333;
font-weight: 400;
line-height: 24px;
&::after {
display: inline-block;
content: " ";
width: 0;
height: 12px;
border-right: 1px #333 solid;
margin: 0 5px;
vertical-align: -2px;
}
&:last-child::after {
display: none;
}
}
// span {
// font-size: 12px;
// font-weight: 400;
// color: #333333;
// line-height: 24px;
// }
}
}
.Pdb-operation {
display: flex;
justify-content: space-around;
margin-bottom: 14px;
&-item {
display: flex;
justify-content: space-between;
align-items: center;
width: 84px;
.Pdbo-item-svg {
width: 16px;
height: 16px;
}
.Pdbo-item-text {
font-size: 14px;
font-weight: 400;
color: #999999;
line-height: 20px;
}
}
}
.Pdb-footer {
display: flex;
flex-direction: column;
align-items: center;
margin: 231px 0 20px;
span:first-child {
margin-bottom: 2px;
font-size: 11px;
font-weight: 400;
color: #999999;
line-height: 16px;
}
span:last-child {
font-size: 20px;
font-weight: 600;
color: #666666;
line-height: 28px;
}
}
.Pdb-recommend {
margin-bottom: 49px;
}
}
}
.Pdbc-body-item {
&.inline span:first-child {
color: #999999 !important;
}
.cr-divider {
width: 100%;
margin: 11px 0;
}
}
\ No newline at end of file
src/views/Policy/Detail/index.vue
View file @ e9d11fea
......@@ -14,6 +14,11 @@ import { getPolicyDetail } from "@/api/policy";
export default {
name: "PolicyList",
mixins: [policyStatusMixin],
provide() {
return {
getPolicy: this.getPolicy
};
},
components: {
Guarantee,
Refund
......@@ -22,16 +27,19 @@ export default {
return {
policy: {
cardConfig: {
component: "Guarantee"
component: ""
}
}
};
},
async created() {
console.log(this.$route.params.orderNo);
const detail = await getPolicyDetail(this.$route.params.orderNo);
this.policy = this.getData(detail);
// if (true) {}
created() {
this.getPolicy();
},
methods: {
async getPolicy() {
const detail = await getPolicyDetail(this.$route.params.orderNo);
this.policy = this.getData(detail);
}
}
};
</script>
......
src/views/Policy/Detail/modules/InsuranceCard.vue
View file @ e9d11fea
<template>
<div class="Pdb-insurance">
<p class="Pdb-insurance-name">{{ product.title }}</p>
<p class="Pdb-insurance-no">NO.{{ policyNo }}<br />由{{ product.compony }}承保</p>
<p class="Pdb-insurance-name">{{ productTitle }}</p>
<p class="Pdb-insurance-no">NO.{{ policyNo }}<br />由{{ productCompany }}承保</p>
<div class="Pdb-insurance-operation">
<cr-button class="Pdbi-operation-button" @click="goNext">{{ buttonText }}</cr-button>
<cr-button class="Pdbi-operation-button">申请理赔</cr-button>
......@@ -25,21 +25,34 @@ export default {
policyNo: {
type: String,
default: ""
},
orderNo: {
type: String,
default: ""
},
policySecId: {
type: String,
default: ""
}
},
data() {
return {};
},
computed: {
product() {
return GOODS_LIST.find(v => v.id === +this.productNo);
productTitle() {
return GOODS_LIST.find(v => v.id === this.productNo)?.title || "";
},
productCompany() {
return GOODS_LIST.find(v => v.id === this.productNo)?.company || "";
},
buttonText() {
return this.autoRenewPremium ? "已开通次年续保" : "已关闭次年续保";
}
},
methods: {
goNext() {}
goNext() {
this.$router.push(`/policy/renewal/${this.orderNo}/${this.policySecId}`);
}
}
};
</script>
......
src/views/Policy/Detail/modules/PayCost.vue
View file @ e9d11fea
......@@ -4,7 +4,7 @@
{{ payCostConfig.title }}
</p>
<div v-else>
<p class="Pdb-payment-title">保障将在XX天后失效，请立即缴费</p>
<p class="Pdb-payment-title">{{ expiredDayText }}</p>
<div class="Pdb-payment-content">
<div class="Pdbp-content-item">
<svg-icon class-name="Pdbpc-item-svg" icon-class="check-circle" />
......@@ -20,12 +20,17 @@
</div>
</div>
</div>
<cr-button class="Pdb-payment-button">{{ payCostConfig.button }}</cr-button>
<cr-button class="Pdb-payment-button" @click="goNext()">{{ payCostConfig.button }}</cr-button>
</div>
</template>
<script>
import detailPayMixin from "@/views/Goods/Detail/modules/detailPay.mixin";
let timer = null;
export default {
name: "PayCost",
mixins: [detailPayMixin],
inject: ["getPolicy"],
props: {
statusKey: {
type: String,
......@@ -37,11 +42,49 @@ export default {
title: "",
button: "立即缴费"
})
},
payInfo: {
type: Object,
default: () => ({
payOrderNo: "",
payType: "",
orderNo: ""
})
},
day: {
type: String,
default: ""
}
},
computed: {
showTips() {
return ["4", "14", "13"].includes(this.statusKey);
},
expiredDayText() {
return this.statusKey === "2" ? `保障将在${this.day}天后失效，请立即缴费` : "";
}
},
watch: {
statusKey: {
immediate: true,
handler(val) {
if (["14", "13"].includes(val)) {
timer = setInterval(this.getPolicy, 3000);
}
}
}
},
beforeDestroy() {
clearTimeout(timer);
},
methods: {
goNext() {
if (this.payCostConfig.button === "立即缴费") {
this.orderInfo = this.payInfo;
this.goPay();
} else {
this.getPolicy();
}
}
}
};
......
src/views/Policy/Detail/modules/Refund.vue
View file @ e9d11fea
......@@ -8,7 +8,7 @@
<span>{{ amount }}元</span>
</div>
<div class="Pdbr-content-item">
<span>支付时间</span>
<span>{{ payTimeText }}</span>
<span>{{ payTime }}</span>
</div>
</div>
......@@ -32,6 +32,10 @@ export default {
payTime: {
type: String,
default: "-"
},
payTimeText: {
type: String,
default: "支付时间"
}
},
data() {
......
src/views/Policy/Detail/modules/StatusDesc.vue
View file @ e9d11fea
<template>
<div>
<p class="Pdb-status" v-if="firstTitle">{{ firstTitle }}</p>
<p class="Pdb-status">{{ secondTitleText }}</p>
<div class="Pdb-tips" v-if="recordText">
<span class="Pdb-tips-text">{{ recordText }}</span>
<p class="Pdb-status" v-if="cardConfig.detailText">{{ cardConfig.detailText }}</p>
<p class="Pdb-status">{{ cardConfig.statusText }}</p>
<div class="Pdb-tips" v-if="cardConfig.recordText" @click="goNext">
<span class="Pdb-tips-text">{{ cardConfig.recordText }}</span>
<svg-icon class-name="Pdb-tips-svg" icon-class="payment-record" />
</div>
</div>
......@@ -12,16 +12,17 @@
export default {
name: "StatusDesc",
props: {
firstTitle: {
type: String,
default: ""
},
secondTitle: {
type: String,
default: ""
cardConfig: {
type: Object,
default: () => ({
detailText: "",
statusText: "",
recordText: "",
status: ""
})
},
recordText: {
type: String,
policySecId: {
type: [String, Number],
default: ""
}
},
......@@ -30,7 +31,17 @@ export default {
},
computed: {
secondTitleText() {
return this.firstTitle ? `${this.secondTitle}...` : this.secondTitle;
return this.cardConfig.detailText
? `${this.cardConfig.statusText}...`
: this.cardConfig.statusText;
}
},
methods: {
goNext() {
const arr = ["6.2-3", "6.1-3", "6.3", "8", "9-5", "9-6", "10"];
if (arr.includes(this.cardConfig?.status)) {
this.$router.push(`/policy/payment-record/${this.policySecId}/${this.cardConfig.status}`);
}
}
}
};
......
src/views/Policy/PaymentRecord/index.vue
View file @ e9d11fea
<template>
<div class="payment-record">
<p class="payment-record-status">持续缴费中</p>
<p class="payment-record-desc payment-record-desc_owe">预计下次扣费时间 2020.5.11</p>
<!-- <div class="payment-record-term">
<p class="payment-record-status">{{ termStatistics.titelText }}</p>
<p
:class="[
{ 'payment-record-desc_owe': $route.params.status === '6.3' },
'payment-record-desc'
]"
>
{{ termStatistics.refundTimeText }}
</p>
<div class="payment-record-term" v-if="isShowCard">
<div class="Pr-term-item">
<span>800元</span>
<span>下期应缴金额</span>
<span>{{ termStatistics.amount }}</span>
<span>{{ termStatistics.amountText }}</span>
</div>
<div class="Pr-term-item">
<span>6/12期</span>
<span>{{ termStatistics.termText }}</span>
<span>已缴/总期数</span>
</div>
<div class="Pr-term-item">
<span>0期</span>
<span>{{ termStatistics.delayTerm }}</span>
<span>已欠缴期数</span>
</div>
</div> -->
</div>
<div class="payment-record-detail">
<div class="Pr-detail-title Pr-detail-title_year">
<span>缴费明细</span>
<span>按月缴费</span>
</div>
<div class="Pr-detail-content">
<div class="Prd-content-amount">
<span>第2期保费</span>
<span>100.0元</span>
</div>
<div class="Prd-content-time">
<span>2020.05.11 17:45</span>
<span>缴费成功</span>
</div>
</div>
<div class="Pr-detail-content">
<div class="Prd-content-amount">
<span>第2期保费</span>
<span>100.0元</span>
</div>
<div class="Prd-content-time">
<span>2020.05.11 17:45</span>
<span>缴费成功</span>
</div>
</div>
<div class="Pr-detail-content">
<div class="Prd-content-amount">
<span>第2期保费</span>
<span>100.0元</span>
</div>
<div class="Prd-content-time">
<span>2020.05.11 17:45</span>
<span>缴费成功</span>
</div>
</div>
<div class="Pr-detail-content">
<div class="Prd-content-amount">
<span>第2期保费</span>
<span>100.0元</span>
</div>
<div class="Prd-content-time">
<span>2020.05.11 17:45</span>
<span>缴费成功</span>
</div>
<span>{{ payPeriodText }}</span>
</div>
<div class="Pr-detail-content">
<div class="Pr-detail-content" v-for="(item, index) in termList" :key="index">
<div class="Prd-content-amount">
<span>第2期保费</span>
<span>100.0元</span>
<span>{{ item.termNoText }}</span>
<span>{{ item.amountText }}</span>
</div>
<div class="Prd-content-time">
<span>2020.05.11 17:45</span>
<span>缴费成功</span>
<span>{{ item.recordDate }}</span>
<span>{{ item.payStatusText }}</span>
</div>
</div>
</div>
</div>
</template>
<script></script>
<script>
import { getPayRecord } from "@/api/policy";
export default {
name: "paymentRecord",
data() {
return {
record: {},
termStatistics: {},
termList: [],
List: [],
title: "",
desc: "",
clauseStatistics: {
amount: 0,
paidTerm: "",
delayTerm: "",
totalTerm: ""
}
};
},
async created() {
this.record = await getPayRecord(this.$route.params.policySecId);
this.getTermStatistics();
this.getTermList();
},
computed: {
payPeriodText() {
return this.record.payPeriod === 1 ? "按月缴费" : "按年缴费";
},
isShowCard() {
console.log(this.record?.payPeriod === 1);
return this.record?.payPeriod === 1 && !["8", "10"].includes(this.$route.params.status);
}
},
methods: {
getTermStatistics() {
const status = this.$route.params.status;
const isMonthPay = this.record?.payPeriod === 1;
let result = {
titelText: "",
refundTimeText: "",
amount: "",
amountText: "",
termText: "",
delayTerm: ""
};
// 不同状态对应的缴费记录
if (["6.2-3", "6.1-3", "6.3"].includes(status)) {
result = {
titelText: isMonthPay ? "持续缴费中" : "缴费成功",
refundTimeText: isMonthPay
? `预计下次扣费时间 ${this.record.nextPayDate}`
: `下次缴费时间 ${this.record.nextPayDate}`,
amount: `${this.record?.nextTermAmount || 0}元`,
amountText: "下期应缴金额",
termText: `${this.record.paidTerm}/${this.record.totalTerm}期`,
delayTerm: `${this.record.delayTerm}期`
};
if (status === "6.3") {
result.refundTimeText = `保单已欠费，欠缴${this.record?.delayAmount}元`;
}
} else if (["8", "9-5", "9-6", "10"].includes(status)) {
result = {
titelText: `共缴纳${this.record.totalAmount}元`,
refundTimeText: "保障已终止",
amount: `${this.record?.nextTermAmount || 0}元`,
amountText: "应退金额",
termText: `${this.record.paidTerm}/${this.record.totalTerm}期`,
delayTerm: `${this.record.delayTerm}期`
};
}
this.termStatistics = result;
},
getTermList() {
const status = this.$route.params.status;
const list =
this.record?.recordTerm?.map(v => ({
termNoText: this.record?.payPeriod === 1 ? `第${v.termNo}期保费` : "1年保费",
recordDate: v.recordDate,
amountText: `${v.amount}元`,
payStatusText:
v.currentPayState === "1" ? "已欠费" : v.currentPayState === "3" ? "缴费成功" : "-"
})) || [];
if (["9-5", "9-6"].includes(status)) {
list.unshift({
termNoText:
this.record?.refundRecord?.currentState === "2"
? "退款中"
: this.record?.refundRecord?.currentState === "3"
? "退款成功"
: "-",
recordDate: this.record?.refundRecord?.payTime || "-",
amountText: `${this.record?.refundRecord?.amount}元`,
payStatusText:
this.record?.refundRecord?.currentState === "2"
? "应退金额"
: this.record?.refundRecord?.currentState === "3"
? "已退金额"
: "-"
});
}
this.termList = list;
}
}
};
</script>
<style lang="less" src="./index.less" scoped></style>
src/views/Policy/Renewal/index.less
View file @ e9d11fea
......@@ -3,116 +3,136 @@
.renewal {
overflow: hidden;
height: 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;
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;
}
&_open {
background: #FFC842;
background: #FFC842;
}
&_closed {
background: #F65D5D;
background: #F65D5D;
}
&-status {
margin: 64px 0 0 20px;
font-size: 28px;
font-weight: 600;
color: #333333;
line-height: 40px;
margin: 64px 0 0 20px;
font-size: 28px;
font-weight: 600;
color: #333333;
line-height: 40px;
}
&-desc {
margin: 0 0 49px 20px;
font-size: 28px;
font-weight: 400;
color: #333333;
line-height: 40px;
margin: 0 0 49px 20px;
font-size: 28px;
font-weight: 400;
color: #333333;
line-height: 40px;
}
&-container {
position: absolute;
left: 0;
right: 0;
bottom: 0;
padding: 28px 20px 34px;
background: #FFFFFF;
position: absolute;
left: 0;
right: 0;
bottom: 0;
padding: 28px 20px 34px;
background: #FFFFFF;
border-radius: 32px 32px 0 0;
&-title {
margin-bottom: 16px;
font-size: 18px;
font-weight: 600;
color: #242629;
line-height: 24px;
font-weight: 600;
color: #242629;
line-height: 24px;
}
&-content {
margin-bottom: 4px;
.Rc-content-item {
display: flex;
align-items: center;
.Rcc-item-svg {
margin-right: 8px;
width: 12px;
height: 12px;
border-radius: 50%;
background: #FFC842;
}
.Rcc-item-text {
font-size: 14px;
font-weight: 400;
color: #333333;
line-height: 24px;
}
}
.Rc-content-item {
display: flex;
align-items: center;
.Rcc-item-svg {
margin-right: 8px;
width: 12px;
height: 12px;
border-radius: 50%;
background: #FFC842;
}
.Rcc-item-text {
font-size: 14px;
font-weight: 400;
color: #333333;
line-height: 24px;
}
}
}
&-read {
margin-bottom: 16px;
font-size: 12px;
font-weight: 400;
color: rgba(153,153,153,1);
line-height: 24px;
span {
color: #787EFF;
}
font-weight: 400;
color: rgba(153, 153, 153, 1);
line-height: 24px;
span {
color: #787EFF;
}
}
&-detail {
margin-bottom: 76px;
height: 130px;
.Rc-detail-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 20px;
height: 60px;
background: #F6F7FA;
border-radius: 14px;
&:first-child {
margin-bottom: 10px;
}
span:first-child {
font-size: 14px;
font-weight: 400;
color: #666666;
line-height: 24px;
}
span:last-child {
font-size: 14px;
font-weight: 600;
color: #242629;
line-height: 24px;
}
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 20px;
height: 60px;
background: #F6F7FA;
border-radius: 14px;
&:first-child {
margin-bottom: 10px;
}
span:first-child {
font-size: 14px;
font-weight: 400;
color: #666666;
line-height: 24px;
}
span:last-child {
font-size: 14px;
font-weight: 600;
color: #242629;
line-height: 24px;
}
}
}
&-button {
width: 100%;
height: 52px;
background: #FFC842;
border-radius: 14px;
font-size: 16px;
font-weight: 600;
color: #333333;
line-height: 22px;
height: 52px;
background: #FFC842 !important;
border-radius: 14px !important;
font-size: 16px;
font-weight: 600;
color: #333333 !important;
line-height: 22px;
}
}
}
\ No newline at end of file
src/views/Policy/Renewal/index.vue
View file @ e9d11fea
<template>
<div class="renewal renewal_open">
<p class="renewal-status">该保单已开通</p>
<div class="renewal " :class="isOpened ? 'renewal_open' : 'renewal_closed'">
<p class="renewal-status">{{ statusText }}</p>
<p class="renewal-desc">次年自动续保</p>
<div class="renewal-container">
<p class="renewal-container-title">现在已享受</p>
<p class="renewal-container-title">{{ enjoyText }}</p>
<div class="renewal-container-content">
<div class="Rc-content-item">
<svg-icon class-name="Rcc-item-svg" icon-class="check-circle" />
......@@ -19,19 +19,56 @@
</div>
</div>
<p class="renewal-container-read">阅读并同意《<span>次年自动续保服务协议</span>》</p>
<div class="renewal-container-detail">
<div class="renewal-container-detail" v-if="!isOpened"></div>
<div class="renewal-container-detail" v-if="isOpened">
<div class="Rc-detail-item">
<span>次年保但生效时间</span>
<span>2020.05.31</span>
<span>{{ nextYear }}</span>
</div>
<div class="Rc-detail-item">
<span>扣款方式</span>
<span>安微信默认顺序依次扣款</span>
<span>按微信默认顺序依次扣款</span>
</div>
</div>
<cr-button class="renewal-container-button">取消续保</cr-button>
<cr-button class="renewal-container-button" @click="submit">{{ buttonText }}</cr-button>
</div>
</div>
</template>
<script></script>
<script>
import { getPolicyDetail, updateRenewal } from "@/api/policy";
export default {
name: "Renewal",
data() {
return {
isOpened: false,
nextYear: "-"
};
},
async created() {
const detail = await getPolicyDetail(this.$route.params.orderNo);
if (detail.autoRenewPremium) {
this.isOpened = true;
}
this.nextYear = detail.nextYearEffectiveDate || "-";
},
computed: {
statusText() {
return this.isOpened ? "该保单已开通" : "该保单未开通";
},
enjoyText() {
return this.isOpened ? "现在已享受" : "开通后享受";
},
buttonText() {
return this.isOpened ? "取消续保" : "免费开通次年自动续保";
}
},
methods: {
async submit() {
await updateRenewal(this.$route.params.policySecId, !this.isOpened);
this.$router.go(-1);
}
}
};
</script>
<style lang="less" src="./index.less" scoped></style>
src/views/Policy/Success/index.vue
View file @ e9d11fea
<template>
<div class="policy-detail">
<div class="policy-detail-body">
<status-desc secondTitle="购买成功"></status-desc>
<Refund></Refund>
<status-desc :cardConfig="cardConfig"></status-desc>
<pay-info :policy="policy"></pay-info>
<ActBanner></ActBanner>
<RecGood></RecGood>
<insurance-recommend class="Pdb-recommend" />
</div>
</div>
</template>
<script>
import ActBanner from "./modules/ActBanner";
import PayInfo from "./modules/PayInfo";
import StatusDesc from "../Detail/modules/StatusDesc";
import Refund from "../Detail/modules/Refund";
import RecGood from "./modules/RecGood";
import InsuranceRecommend from "../modules/InsuranceRecommend";
import { getGenPolicyDetail } from "@/api/policy";
import policyStatusMixin from "../mixin/policyStatus.mixin";
export default {
name: "Sucess",
mixins: [policyStatusMixin],
components: {
StatusDesc,
Refund,
PayInfo,
ActBanner,
RecGood
InsuranceRecommend
},
data() {
return {};
return {
policy: {},
cardConfig: {
detailText: "购买成功"
}
};
},
computed: {
showPayCost() {
return ["2", "4"].includes(this.data?.cardConfig?.key);
}
async created() {
const detail = await getGenPolicyDetail(this.$route.params.orderNo);
this.policy = this.getGoodsInfo(detail);
}
};
</script>
......
src/views/Policy/Success/modules/ActBanner.vue
View file @ e9d11fea
<template functional>
<div class="activity-banner">
<div class="activity-banner-item" @click="parent.$router.push('/draw')">
<div class="activity-banner-item" @click="parent.$router.push('/home/activity')">
<cr-image src="@/assets/images/policy/draw.png" width="343px" height="60px" />
</div>
</div>
......
src/views/Policy/Success/modules/PayInfo.vue 0 → 100644
View file @ e9d11fea
<template>
<div class="Pdb-refund">
<div class="Pdb-refund-content">
<div class="Pdbr-content-item">
<span>保障期限</span>
<span>{{ payInfo.guaranteePeriodText }}</span>
</div>
<div class="Pdbr-content-item">
<span>保费</span>
<span>{{ payInfo.permium }}</span>
</div>
</div>
<p class="Pdb-refund-note" v-if="payInfo.isShowNote">
{{ payInfo.note }}
</p>
<div class="Pdb-refund-operation">
<cr-button class="Pdbi-operation-button Pdbi-operation-button_paid" @click="goNext('product')"
>为家人投保</cr-button
>
<cr-button class="Pdbi-operation-button" @click="goNext('policy')">查看保单</cr-button>
</div>
</div>
</template>
<script>
export default {
name: "PayInfo",
props: {
policy: {
type: Object,
default: () => ({})
}
},
data() {
return {};
},
computed: {
payInfo() {
let result = {
guaranteePeriodText: `${this.policy?.policyEffectiveDate || "-"}至${this.policy
?.policyEndDate || "-"}`,
permium: "",
note: "",
isShowNote: true
};
const payType = this.policy?.payType?.find(
v => v.value === this.policy?.productItem?.payType
);
// 根据月缴或年缴区分缴费卡片内容
if (payType?.label === "月缴") {
result = {
...result,
permium: `首月保费${this.policy?.downPayPrice || 0}元，次月起${this.policy
?.regularPrice || 0}元`,
note: `注:微信将会在每月${this.policy.nextPayInfo.day}日在您的账户内扣除该保费。（您可以随时取消自动扣费）`
};
} else {
result = {
...result,
permium: `${this.policy?.downPayPrice || 0}元/年`,
note: `合同终止前，每年${this.policy?.nextPayInfo?.day || "-"}月${this.policy?.nextPayInfo
?.day || "-"}日${this.policy?.company || "-"}保险公司将在您预留尾号为${this.policy
?.bankCardNoLast4 || "-"}的银行卡内扣除次年保费，请保证余额充足哦。`
};
// 缴费方式为“一次结清”时不显示扣费提醒
if (!payType || payType === "一次交清") {
result.isShowNote = false;
}
}
// 根据产品是否存在保障期限确定保障期限文案
if (this.policy?.policyPeriod?.length) {
const policyPeriod = this.policy.policyPeriod.find(
v => v.value === this.policy?.productItem?.policyPeriod
);
result.guaranteePeriodText = policyPeriod.label || "";
}
return result;
}
},
methods: {
goNext(type) {
if (type === "product") {
this.$router.push({
path: "/goods/detail",
query: { id: this.policy.id, type: this.policy.itype }
});
} else if (type === "policy") {
this.$router.push(`/policy/detail/${this.policy.orderNo}`);
}
}
}
};
</script>
<style lang="less" src="../../Detail/index.less" scoped></style>
src/views/Policy/constants.js
View file @ e9d11fea
......@@ -14,7 +14,7 @@ const statusMap = {
title: "被保人：${title}",
contend: "保障期限：${start} 至 ${end}",
statusText: "保障中",
buttons: ["开通自动续费", "电子保单"],
buttons: ["去支付", "电子保单"],
detailText: "",
recordText: "保单已欠费，欠缴${money}元",
component: "Guarantee"
......
src/views/Policy/mixin/orderInfo.mixin.js 0 → 100644
View file @ e9d11fea
export default {
computed: {
payInfo() {
return {
payOrderNo: this.data?.payInfo?.payOrderNo,
payOrderType: this.data?.payInfo?.payOrderType,
orderNo: this.data?.orderNo
};
}
}
};
src/views/Policy/mixin/policyStatus.mixin.js
View file @ e9d11fea
......@@ -14,8 +14,6 @@ export default {
const key = this.findKey(policy);
const value = _.cloneDeep(STATUS_MAP[key]);
// console.log(status, key, value);
if (["6", "7", "8", "9"].includes(key)) {
value.title = value.title.replace("${title}", policy?.refundInfo?.amount || "-");
value.contend = value.contend.replace(
......@@ -28,19 +26,22 @@ export default {
.replace("${start}", parseTime(policy?.policyEffectiveDate, "{y}-{m}-{d}"))
.replace("${end}", parseTime(policy?.policyEndDate, "{y}-{m}-{d}"))
.replace("${money}", policy?.payInfo?.amount || "-");
if (key === "2") {
value.recordText = value.recordText.replace("${money}", policy?.payInfo?.amount || "-");
}
}
// 校验是否支付成功
const status = this.getStatus(policy);
console.log(1, this.isFromPay, status);
if (["6.2-3", "6.1-3"].includes(status) && this.isFromPay) {
this.$router.replace("/policy/success");
this.$router.replace(`/policy/success/${this.$route.params.orderNo}`);
}
return {
...policy,
..._.find(GOODS_LIST, { id: +policy?.productNo }),
cardConfig: { ...value, key }
..._.find(GOODS_LIST, { id: policy?.productNo }),
cardConfig: { ...value, key, status: this.getStatus(policy) }
};
},
findKey(policy) {
......@@ -51,6 +52,12 @@ export default {
return policy?.payState
? `${policy?.policyState}-${policy?.payState}`
: String(policy?.policyState);
},
getGoodsInfo(policy) {
return {
...policy,
..._.find(GOODS_LIST, { id: policy?.productNo })
};
}
},
beforeRouteEnter(to, from, next) {
......@@ -58,7 +65,6 @@ export default {
const prePath = ["/goods/inform", "/goods/detail", "/policy/add"];
if (prePath.includes(from.path)) {
vm.isFromPay = true;
console.log(2, vm.isFromPay);
}
});
}
......
src/views/Policy/modules/InsuranceRecommend.vue
View file @ e9d11fea
<template>
<div class="policy-recommend">
<div class="policy-recommend-content">
<cr-image class="Prc-left" width="" height="" :src="recommendContent" />
<cr-image class="Prc-left" width="" height="" :src="goods.img" />
<div class="Prc-right">
<p class="Prc-right-title">
<span>50万</span>
<span>重疾保障</span>
<span>30万</span>
<span>{{ goods.guarantee_title }}</span>
</p>
<p class="Prc-right-desc">优势介绍 优势介绍 优势介绍</p>
<p class="Prc-right-desc">{{ goods.guarantee_sub }}</p>
</div>
</div>
<cr-button class="policy-recommend-button" @click="goNext()">点此投保</cr-button>
<cr-image class="policy-recommend-angle" width="" height="" :src="recommendAngle" />
<cr-image
class="policy-recommend-angle"
width=""
height=""
src="@/assets/images/policy/recommend-angle@2x.png"
/>
</div>
</template>
<script>
import recommendAngle from "@/assets/images/policy/recommend-angle@2x.png";
import recommendContent from "@/assets/images/policy/recommend-content@2x.png";
import GOODS_LIST from "@/api/goodsList.mock";
const goods = GOODS_LIST.find(v => v.id === "HTDQZJX001");
export default {
name: "InsuranceRecommend",
data() {
return {
recommendAngle,
recommendContent
goods
};
},
methods: {
goNext() {
// todo 跳转医疗险详情页
this.$router.push({
path: "/goods/detail",
query: { id: this.goods.id, type: this.goods.itype }
});
}
}
};
......
src/views/Policy/modules/PolicyItem.vue
View file @ e9d11fea
......@@ -34,7 +34,7 @@
]"
v-for="button in item.cardConfig.buttons"
:key="button"
@click="goNext(button, item)"
@click.stop="goNext(button, item)"
>{{ button }}</cr-button
>
<p
......@@ -77,6 +77,7 @@ import _ from "lodash";
import GOODS_LIST from "@/api/goodsList.mock";
import { getPolicyList } from "@/api/policy";
import policyStatusMixin from "../mixin/policyStatus.mixin";
import detailPayMixin from "@/views/Goods/Detail/modules/detailPay.mixin";
// SELF(0, "本人"),
// PARENT(1, "父母"),
......@@ -86,7 +87,7 @@ const relations = [-1, 0, 1, 2, 3];
export default {
name: "InsuranceRecommend",
mixins: [policyStatusMixin],
mixins: [policyStatusMixin, detailPayMixin],
props: {
type: {
type: Number,
......@@ -112,7 +113,7 @@ export default {
this.list = list
.filter(
v =>
_.some(GOODS_LIST, { id: +v.productNo }) &&
_.some(GOODS_LIST, { id: v.productNo }) &&
(type === 0 ? true : v.insuredRelation === relations[type]) &&
this.findKey(v)
)
......@@ -121,15 +122,23 @@ export default {
showStatusText(text) {
return text === "保障中";
},
// goNext(text, item) {
goNext() {
// if (text === "为家人投保") {
// } else if (text === "电子保单") {
// } else if (text === "开通自动续费") {
// } else if (text === "去支付") {
// } else if (text === "重新投保") {
// } else if (text === "联系客服") {
// }
goNext(text, item) {
if (["为家人投保", "重新投保"].includes(text)) {
this.$router.push({
path: "/goods/detail",
query: { id: item.id, type: item.itype }
});
} else if (text === "电子保单") {
this.$router.push({ path: "/policy/virtual-detail", query: { url: item.policyUrl } });
} else if (text === "去支付") {
this.orderInfo = {
payOrderNo: item?.payInfo?.payOrderNo,
payType: item?.payInfo?.payType,
orderNo: item?.orderNo
};
this.goPay();
} else if (text === "联系客服") {
}
},
goDetail(orderNo) {
const policy = this.list.find(v => v.orderNo === orderNo);
......
src/views/User/Family/index.less
View file @ e9d11fea
......@@ -66,9 +66,14 @@
line-height: 16px;
}
&_overlay {
&_overlay_2 {
border-radius: 17px;
margin-top: 35px;
margin-top: 10px;
box-shadow: 0px -5px 25px 0px rgba(0,0,0,0.07), 0px -20px 0 -10px #FFFFFF;
}
&_overlay_3 {
border-radius: 17px;
margin-top: 15px;
box-shadow: 0px -5px 25px 0px rgba(0,0,0,0.07), 0px -20px 0 -10px #FFFFFF, 0px -25px 25px 0px rgba(0,0,0,0.07), 0px -33px 0 -14px #FFFFFF;
}
}
......
src/views/User/Family/index.vue
View file @ e9d11fea
......@@ -19,7 +19,11 @@
</div>
<div class="family-list" v-else>
<div
class="family-list-item_overlay family-list-item"
:class="[
{ 'family-list-item_overlay_2': familyList.length === 2 },
{ 'family-list-item_overlay_3': familyList.length >= 3 },
'family-list-item'
]"
@click="go(`/user/family/detail/${familyList[0].userInfoSecId}`)"
>
<div class="Fl-item-left">
......@@ -30,7 +34,7 @@
<p class="Fl-item-right" v-if="familyList[0].auth">已认证</p>
</div>
</div>
<div class="family-collapse" @click="isCollapse = !isCollapse">
<div class="family-collapse" v-if="familyList.length !== 1" @click="isCollapse = !isCollapse">
<span class="family-collapse-text">{{ collapseText }}</span>
<svg-icon
icon-class="triangle-down"
......
src/views/User/Family/modules/FamilyForm.vue
View file @ e9d11fea
......@@ -84,7 +84,7 @@
<span>与您关系:</span>
<span>{{ formData.relation }}</span>
</div>
<div class="Fc-modal-item">
<div class="Fc-modal-item" v-if="formData.socialSecurity">
<span>有无社保:</span>
<span>{{ formData.socialSecurity === "true" ? "有社保" : "无社保" }}</span>
</div>
......@@ -204,16 +204,23 @@ export default {
this.modal.confirm = false;
// 组件不支持boolean,需转换
const params = {
...this.formData,
socialSecurity: this.formData?.socialSecurity === "true" ? true : false
name: this.formData?.nameMask,
idNo: this.formData?.idNoMask,
relation: this.getReletion(this.formData?.relation)
};
// 转换参数类型
if (this.formData?.socialSecurity !== "") {
params.socialSecurity = this.formData?.socialSecurity === "true" ? true : false;
}
if (this.type === "add") {
await addFamily(params);
await this.setFamilyList();
this.formData = _.cloneDeep(defaultFormData);
} else {
params.userInfoSecId = this.information?.userInfoSecId;
await updateFamily(params);
this.$router.push("/user/family");
}
await this.setFamilyList();
this.formData = _.cloneDeep(defaultFormData);
},
onConfirm(picker, res) {
this.formData.relation = res[0];
......@@ -228,9 +235,25 @@ export default {
}
},
async delFamily() {
console.log(this.information);
this.modal.delete = false;
await delFamily();
await delFamily({ userInfoSecId: this.information?.userInfoSecId });
this.$router.push("/user/family");
},
getReletion(relation) {
let result = -1;
if (["父亲", "母亲"].includes(relation)) {
result = 1;
} else if (["女儿", "儿子"].includes(relation)) {
result = 3;
} else if (relation === "本人") {
result = 0;
} else if (relation === "配偶") {
result = 2;
}
return result;
}
}
};
......
src/views/User/HelpCenter/index.less
View file @ e9d11fea
......@@ -39,6 +39,7 @@
left: 0;
right: 0;
bottom: 0;
overflow-y: scroll;
padding: 15px 20px 0;
background: #FFFFFF;
border-radius: 32px 32px 0 0;
......
src/views/User/index.less
View file @ e9d11fea
......@@ -187,6 +187,22 @@
font-size: 11px;
font-weight: 400;
color: @tag-warning-light-color;
&_illness {
background: #FFD8BF;
color: #FF6702;
}
&_life {
background: #F3F2F1;
color: #DDB984;
}
&_casualty {
background: #F6E8FF;
color: #858AFF;
}
&_medical {
background: #FFEAB7;
color: #EAAD1A;
}
}
}
.Ufii-middle-footer {
......
src/views/User/index.vue
View file @ e9d11fea
<template>
<div class="user">
<div class="user-info">
<div class="user-info-account" @click="go('', true)">
<div class="user-info-account" @click="go()">
<span>{{ userInfo.name }}</span>
<span>{{ userInfo.phoneNoMask }}</span>
</div>
<div class="user-info-image" @click="go('', true)">
<div class="user-info-image" @click="go()">
<cr-image
class="user-info-image-avatar"
width=""
......@@ -30,7 +30,7 @@
<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" @click="go()">
<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> -->
......@@ -41,20 +41,29 @@
<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">
<div class="user-service-main">
<cr-cell
title="帮助中心"
:icon="help"
class="user-service-main-item"
@click="go('/user/help-center', false)"
>
<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">
<cr-cell
title="客服电话"
:icon="customerService"
class="user-service-main-item"
@click="go()"
>
<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>
<p class="user-logo-desc" @click="go('/introduction', false)">了解芒果保险</p>
</div>
<record-layer v-model="showLayer" desc="敬请期待"></record-layer>
<tabbar></tabbar>
</div>
</template>
......@@ -64,15 +73,14 @@ import customerService from "@/assets/images/user/customer-service@2x.png";
import help from "@/assets/images/user/help@2x.png";
import UserFamily from "./modules/UserFamily";
import Tabbar from "@/components/Tabbar";
import RecordLayer from "@/components/RecordLayer";
import { getPolicyList } from "@/api/policy";
import localStorage from "@/service/localStorage";
export default {
name: "User",
components: {
UserFamily,
Tabbar,
RecordLayer
Tabbar
},
data() {
return {
......@@ -84,22 +92,36 @@ export default {
};
},
computed: {
...mapState("user", ["familyList", "userInfo"])
...mapState("user", ["familyList", "userInfo"]),
...mapState(["isShowLogin"])
},
async created() {
this.setUserInfo();
const policyList = await getPolicyList();
await this.setFamilyList(policyList);
this.showDot = policyList.some(policy => policy.policyState === "6.3");
created() {
if (localStorage.get("mongoToken")) {
this.getUserInfo();
}
},
watch: {
isShowLogin(val) {
if (!val && localStorage.get("mongoToken")) {
this.getUserInfo();
}
}
},
methods: {
...mapActions("user", ["setFamilyList", "setUserInfo"]),
go(path, isOverlay = false) {
if (isOverlay) {
this.showLayer = true;
} else {
this.$router.push(path);
...mapActions(["setIsShowLogin"]),
go(path, isNeedLogin = true) {
if (isNeedLogin && !localStorage.get("mongoToken")) {
this.setIsShowLogin(true);
return;
}
if (path) this.$router.push(path);
},
async getUserInfo() {
this.setUserInfo();
const policyList = await getPolicyList();
await this.setFamilyList(policyList);
this.showDot = policyList.some(policy => policy.policyState === "6.3");
}
}
};
......
src/views/User/modules/UserFamily.vue
View file @ e9d11fea
......@@ -22,8 +22,12 @@
</div>
</div>
<div class="user-family-insurance">
<!-- user-family-insurance-item-middle_enable 保障中 -->
<div class="user-family-insurance-item" v-for="(item, index) in policyList" :key="index">
<div
class="user-family-insurance-item"
@click="go('/policy/detail', item)"
v-for="(item, index) in policyList"
:key="index"
>
<cr-image
round
width=""
......@@ -31,59 +35,43 @@
class="user-family-insurance-item-left"
:src="item.productNo ? item.icon : item.icon_closed"
/>
<div class="user-family-insurance-item-middle">
<div
:class="[
{ 'user-family-insurance-item-middle_enable': item.productNo },
'user-family-insurance-item-middle'
]"
>
<div class="Ufii-middle-main">
<span class="Ufii-middle-main-title">{{ item.guarantee_title }}</span>
<span class="Ufii-middle-main-status" v-if="item.productNo">保障中</span>
<span
:class="[
{ 'Ufii-middle-main-status_medical': item.itype === 'mi' },
{ 'Ufii-middle-main-status_illness': item.itype === 'cii' },
{ 'Ufii-middle-main-status_casualty': item.itype === 'ai' },
{ 'Ufii-middle-main-status_life': item.itype === 'li' },
'Ufii-middle-main-status'
]"
v-if="item.productNo"
>保障中</span
>
</div>
<div class="Ufii-middle-footer">{{ item.guarantee_sub }}</div>
</div>
<p class="user-family-insurance-item-right" v-if="!item.productNo">开启保障</p>
</div>
<!-- <div class="user-family-insurance-item">
<cr-image round width="" height="" class="user-family-insurance-item-left" :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-right">开启保障</p>
</div>
<div class="user-family-insurance-item">
<cr-image
round
width=""
height=""
class="user-family-insurance-item-left"
:src="casualty"
/>
<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-right">开启保障</p>
<p
class="user-family-insurance-item-right"
v-if="!item.productNo"
@click.stop="go('/goods/detail', item)"
>
开启保障
</p>
</div>
<div class="user-family-insurance-item">
<cr-image round width="" height="" class="user-family-insurance-item-left" :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-right">开启保障</p>
</div> -->
</div>
</div>
</template>
<script>
import { mapState } from "vuex";
import localStorage from "@/service/localStorage";
import GOODS_LIST from "@/api/goodsList.mock";
export default {
name: "UserFamily",
......@@ -96,22 +84,33 @@ export default {
computed: {
...mapState("user", ["familyList"]),
policyList() {
if (!localStorage.get("mongoToken")) {
// 未登录时返回默认徽章墙
const policyList = GOODS_LIST.filter(v => v.id !== "BNZJX001");
return policyList;
}
return this.familyList[this.activeIndex]?.policyList;
}
},
watch: {
familyList() {
this.$nextTick(() => {
console.log(this.familyList.length);
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);
});
}
},
methods: {
go(path) {
go(path, params) {
if (path === "/goods/detail" && params) {
path = {
path,
query: { id: params.id, type: params.itype }
};
} else if (path === "/policy/detail" && params.orderNo) {
path = `${path}/${params.orderNo}`;
}
this.$emit("go", path);
}
}
......
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