Skip to content

dev / pingan-life-index-pro

Go to a project
Toggle navigation
Toggle navigation pinning
e8d215ed by simon
Options

默认提交

1 parent f9bdf0d5
Inline Side-by-side
Showing 8 changed files with 457 additions and 362 deletions
1
2 # 中国平安人寿(香港) 1 # 中国平安人寿(香港)
3 2
4 --- 3 ---
...@@ -7,32 +6,51 @@ ...@@ -7,32 +6,51 @@
7 6
8 中国平安人寿(香港) 官网 7 中国平安人寿(香港) 官网
9 8
10 --- 9 ---
10
11 ## 技术选型
12
13 #### 技术框架
14
15 项目框架: vuejs
16
17 脚手架版本: vue-cli3
18
19 #### 开发环境
20
21 node 版本: 推荐 v12.10.0 或以上
22
23 npm 版本: 推荐 6.10.3 或以上
11 24
12 ## 开始使用 25 ## 开始使用
13 26
27 ---
14 28
15 #### 安装依赖 (建议使用国内镜像) 29 #### 安装依赖 (建议使用国内镜像)
30
16 ``` 31 ```
17 npm install 32 npm install
18 ``` 33 ```
19 34
20 #### 项目预览 35 #### 项目预览
36
21 ``` 37 ```
22 npm run dev 38 npm run dev
23 ``` 39 ```
24 40
25 #### 项目打包 41 #### 项目打包
42
26 ``` 43 ```
27 npm run build 44 npm run build
28 ``` 45 ```
29 46
30 #### 项目打包 -- 沙箱环境 47 #### 项目打包 -- 沙箱环境
48
31 ``` 49 ```
32 npm run sandbox 50 npm run sandbox
33 ``` 51 ```
34 52
35 --- 53 ---
36 54
37 ## 项目结构 55 ## 项目结构
38 56
...@@ -68,53 +86,63 @@ npm run sandbox ...@@ -68,53 +86,63 @@ npm run sandbox
68 86
69 ``` 87 ```
70 88
71 --- 89 ---
72
73 ## 前置说明
74
75 #### 开发环境
76
77 脚手架版本: CLI3
78
79 node版本: 推荐v12.10.0或以上
80
81 npm版本: 推荐6.10.3或以上
82
83 ---
84 90
85 ## 规范说明 91 ## 规范说明
86 92
87 #### vue文件分离 93 #### vue 文件分离
88 94
89 一般业务.vue文件通常会在同一目录下拆分为.vue,.js,.scss三个文件。 95 一般业务.vue 文件通常会在同一目录下拆分为.vue,.js,.scss 三个文件。
90 96
91 正常的创建和引用vue文件都是html、css、js三者在一起的，这样写起来虽然方便了，但是页面比较大或者代码比较多的情况下，即使使用组件有时代码也比较多，简单来说查找不变不利于编程，大的来说影像优化性能。将代码中的html、css、js分离出来是个很好的选择。 97 正常的创建和引用 vue 文件都是 html、css、js 三者在一起的，这样写起来虽然方便了，但是页面比较大或者代码比较多的情况下，即使使用组件有时代码也比较多，简单来说查找不变不利于编程，大的来说影像优化性能。将代码中的 html、css、js 分离出来是个很好的选择。
92 98
93 #### 编码规范 99 #### 编码规范
94 100
95 本项目不使用eslint代码检查工具。 101 本项目不使用 eslint 代码检查工具。
96 102
97 开发人员需遵循vue官方风格规范。 103 开发人员需遵循 vue 官方风格规范。
98 104
99 #### 样式规范 105 #### 样式规范
100 106
101 - 优先使用 _var.scss 声明的样式变量 107 - 优先使用 \_var.scss 声明的样式变量
102 - font-family 名字顺序 Arial -> Microsoft YaHei 108 - font-family 名字顺序 Arial -> Microsoft YaHei
103 109
104 #### z-index权重划分 110 #### z-index 权重划分
105 111
106 - 遮罩蒙层:5000 112 - 遮罩蒙层:5000
107 - 导航栏:3000 113 - 导航栏:3000
108 - element-ui:2000+ 114 - element-ui:2000+
109 - 自定义交互组件 如date-picker: 800-900 115 - 自定义交互组件 如 date-picker: 800-900
110 - 一般业务级:小于100 116 - 一般业务级:小于 100
111 117
112 #### 响应式方案 118 #### 响应式方案
113 119
114 通过purecss+@media方式实现。 120 通过 purecss+@media 方式实现。
115 121
116 选取原因： 122 选取原因：
117 - 与bootstrap相比，purecss要轻量得多 123
124 - 与 bootstrap 相比，purecss 更为轻量。
125
126 ## 前后端数据交互
127
128 #### 简述
129
130 为了实现前后端分离，前后端需要约定一套数据交互规范。后续前后端数据接口的输入输出需要按照本文档执行。
131
132 #### 数据格式
133
134 数据格式: json
135
136 跨域处理使用跨域资源共享(Cross-Origin Resource Sharing)方式，允许跨域的接口需要在返回头中输出相应的 header。
137
138 #### 数据接口输出
139
140 | 字段 | 数据类型 | 必要 | 参说明 |
141 | ------- | -------- | ---- | --------------------------------------- |
142 | success | Boolean | Y | 是否请求成功（true：成功，false：失败） |
143 | errMsg | Integer | N | 请求失败原因 |
144 | code | String | Y | 请求失败错误代码 |
145 | content | Object | N | 业务返回具体参数 |
118 146
119 #### 数据加密 147 #### 数据加密
120 148
...@@ -122,7 +150,7 @@ npm版本: 推荐6.10.3或以上 ...@@ -122,7 +150,7 @@ npm版本: 推荐6.10.3或以上
122 150
123 加密方案：AES+RSA 151 加密方案：AES+RSA
124 152
125 --- 153 ---
126 154
127 ## 国际化支持说明 155 ## 国际化支持说明
128 156
...@@ -130,8 +158,7 @@ npm版本: 推荐6.10.3或以上 ...@@ -130,8 +158,7 @@ npm版本: 推荐6.10.3或以上
130 158
131 采用方案：[i18n](https://github.com/kazupon/vue-i18n) 159 采用方案：[i18n](https://github.com/kazupon/vue-i18n)
132 160
133 在文件入口main.js注入i18n 161 在文件入口 main.js 注入 i18n
134
135 162
136 #### 三语支持(默认繁体): 163 #### 三语支持(默认繁体):
137 164
...@@ -141,17 +168,14 @@ npm版本: 推荐6.10.3或以上 ...@@ -141,17 +168,14 @@ npm版本: 推荐6.10.3或以上
141 168
142 三语文件所在目录: 169 三语文件所在目录:
143 170
144
145 #### 执行逻辑 171 #### 执行逻辑
146 172
147 访问页面时，会先从localStorage里获取历史选取语言，若活动结果为空，则默认使用繁体。 173 访问页面时，会先从 localStorage 里获取历史选取语言，若活动结果为空，则默认使用繁体。
148
149
150 174
151 语言切换时，把当前选择语言注入到i18n并埋到localStorage，同时广播事件，通知页面初始化(重新读取cms内容)。 175 语言切换时，把当前选择语言注入到 i18n 并埋到 localStorage，同时广播事件，通知页面初始化(重新读取 cms 内容)。
152 176
153 --- 177 ---
154 178
155 ## TODO 179 ## TODO
156 180
157 - [x] 项目后期需补充 SEO优化插件 PrerenderSPAPlugin 181 - [x] 项目后期需补充 SEO 优化插件 PrerenderSPAPlugin
......
1 /**
2 * 组件描述: 用户登陆提示
3 * 其中包含
4 * 1.用户登陆提示
5 * 2.五项基本信息验证
6 */
7
1 import { 8 import {
2 mapState 9 mapState
3 } from 'vuex'; 10 } from 'vuex';
4 11
5 export default { 12 export default {
6 props: { 13 props: {
7 // 模型；auth、suggest 14 // 模型；auth、suggest
8 model: { 15 model: {
9 type: String, 16 type: String,
10 default: "auth" 17 default: "auth"
11 }, 18 },
12 checkProfile: { 19 checkProfile: {
13 type: Boolean, 20 type: Boolean,
14 default: false 21 default: false
15 }, 22 },
16 // m1 、m2、m3 23 // m1 、m2、m3
17 tipModel: { 24 tipModel: {
18 type: String, 25 type: String,
19 default: "m3" 26 default: "m3"
20 } 27 }
21 }, 28 },
22 data() { 29 data() {
23 return { 30 return {
24 key: 'value', 31 key: 'value',
25 showProfileInfo: false, 32 showProfileInfo: false,
26 showUnAuth: false, 33 showUnAuth: false,
27 showSuggest: true, 34 showSuggest: true,
28 tips: { 35 tips: {
29 36
30 } 37 }
31 } 38 }
32 }, 39 },
33 components: {}, 40 components: {},
34 computed: { 41 computed: {
35 ...mapState({ 42 ...mapState({
36 userInfo: state => state.userInfo 43 userInfo: state => state.userInfo
37 }), 44 }),
38 locale() { 45 locale() {
39 return this.$i18n.locale || 'tc'; 46 return this.$i18n.locale || 'tc';
40 }, 47 },
41 i18n() { 48 i18n() {
42 return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {}; 49 return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {};
43 }, 50 },
44 showPanel() { 51 // 如果 用户未登陆 或者 五项基本信息未验证
45 let b1 = this.model == "auth" && (this.showProfileInfo || this.showUnAuth); 52 showPanel() {
46 let b2 = this.model == "suggest" && this.showSuggest; 53 let b1 = this.model == "auth" && (this.showProfileInfo || this.showUnAuth);
47 return b1 || b2; 54 let b2 = this.model == "suggest" && this.showSuggest;
48 } 55 return b1 || b2;
49 }, 56 }
50 methods: { 57 },
51 initData() { 58 methods: {
52 this.tips = this.i18n.customService.unauth[this.tipModel]; 59 // 检测用户状态，触发用户登陆/登出
53 if (this.userInfo && this.userInfo.name) { 60 initData() {
54 this.loginAction(); 61 this.tips = this.i18n.customService.unauth[this.tipModel];
55 } else { 62 if (this.userInfo && this.userInfo.name) {
56 this.logoutAction(); 63 this.loginAction();
57 } 64 } else {
58 }, 65 this.logoutAction();
59 loginAction() { 66 }
60 this.showUnAuth = false; 67 },
61 if (this.checkProfile) { 68 loginAction() {
62 if (this.userInfo.hadFullInfo == 1) { 69 this.showUnAuth = false;
63 this.$emit("onLogin", this.userInfo); 70 if (this.checkProfile) {
64 } else { 71 if (this.userInfo.hadFullInfo == 1) {
65 this.showProfileInfo = true; 72 this.$emit("onLogin", this.userInfo);
66 } 73 } else {
67 } else { 74 this.showProfileInfo = true;
68 this.$emit("onLogin", this.userInfo); 75 }
69 } 76 } else {
70 }, 77 this.$emit("onLogin", this.userInfo);
71 logoutAction() { 78 }
72 this.showUnAuth = true; 79 },
73 this.showProfileInfo = false; 80 logoutAction() {
74 this.$emit("onLogout", {}); 81 this.showUnAuth = true;
75 }, 82 this.showProfileInfo = false;
76 gotoLoginPage() { 83 this.$emit("onLogout", {});
77 let callback = this.$route.path; 84 },
78 let separator = "?"; 85 // 前往登陆(带重定向)
79 for (let key in this.$route.query) { 86 gotoLoginPage() {
80 callback += separator + key + "=" + this.$route.query[key]; 87 let callback = this.$route.path;
81 separator = "&"; 88 let separator = "?";
82 } 89 for (let key in this.$route.query) {
83 this.$router.push({ path: "/login?callback=" + callback }); 90 callback += separator + key + "=" + this.$route.query[key];
84 }, 91 separator = "&";
85 gotoRegisterPage() { 92 }
86 this.$router.push({ path: "/register" }); 93 this.$router.push({
87 }, 94 path: "/login?callback=" + callback
88 gotoInformationPage() { 95 });
89 let c = this.$route.fullPath; 96 },
90 this.$router.push({ path: "/infomation/improve", query: { c: c, a: 1 } }); 97 // 前往注册页面
91 }, 98 gotoRegisterPage() {
92 noAuth() { 99 this.$router.push({
93 this.$store.commit("SET_USER_INFO", null); 100 path: "/register"
94 this.initData(); 101 });
95 this.$emit("onLogout", {}); 102 },
96 } 103 gotoInformationPage() {
97 }, 104 let c = this.$route.fullPath;
98 mounted() { 105 this.$router.push({
99 this.initData(); 106 path: "/infomation/improve",
100 }, 107 query: {
101 created() { 108 c: c,
109 a: 1
110 }
111 });
112 },
113 noAuth() {
114 this.$store.commit("SET_USER_INFO", null);
115 this.initData();
116 this.$emit("onLogout", {});
117 }
118 },
119 mounted() {
120 this.initData();
121 },
122 created() {
102 this.$root.eventBus.$on("langChange", () => { 123 this.$root.eventBus.$on("langChange", () => {
103 try { 124 try {
104 this.tips = this.i18n.customService.unauth[this.tipModel]; 125 this.tips = this.i18n.customService.unauth[this.tipModel];
105 } catch (e) { } 126 } catch (e) {}
106 }); 127 });
107 }, 128 },
108 watch: { 129 watch: {
109 userInfo(val) { 130 userInfo(val) {
110 if (val && val.name) { 131 if (val && val.name) {
111 this.loginAction(); 132 this.loginAction();
112 } else { 133 } else {
113 this.logoutAction(); 134 this.logoutAction();
114 } 135 }
115 } 136 }
116 }, 137 },
117 } 138 }
......
1 <template> 1 <template>
2 <div v-if="showPanel"> 2 <div v-if="showPanel">
3 <div v-if="showUnAuth"> 3 <!-- 登陆提示 -->
4 <div class="alert"> 4 <div v-if="showUnAuth">
5 <img class="icon" src="@/assets/images/common/icon-alert-i.png" alt=""> 5 <div class="alert">
6 <div class="txt"> 6 <img class="icon" src="@/assets/images/common/icon-alert-i.png" alt="">
7 {{tips.tit}} 7 <div class="txt">
8 <span class="pointer btn" @click="gotoLoginPage">{{$t('customService.unauth.login')}}</span> 8 {{tips.tit}}
9 {{tips.or}} 9 <span class="pointer btn" @click="gotoLoginPage">{{$t('customService.unauth.login')}}</span>
10 <span class="pointer btn" @click="gotoRegisterPage">{{$t('customService.unauth.register')}}</span> 10 {{tips.or}}
11 {{tips.tail}} 11 <span class="pointer btn" @click="gotoRegisterPage">{{$t('customService.unauth.register')}}</span>
12 </div> 12 {{tips.tail}}
13 </div>
13 14
14 <img v-if="model=='suggest'" class="pointer close" src="@/assets/images/common/icon-alert-close.png" alt="" @click="showSuggest = false"> 15 <img v-if="model=='suggest'" class="pointer close" src="@/assets/images/common/icon-alert-close.png" alt="" @click="showSuggest = false">
15 </div> 16 </div>
16 </div> 17 </div>
18 <!-- 五项基本信息验证提示 -->
19 <div v-if="showProfileInfo">
20 <div class="alert">
21 <img class="icon" src="@/assets/images/common/icon-alert-i.png" alt="">
22 <div class="txt">
23 {{$t('customService.unauth.baseInfoTip')}}&nbsp;
24 <span class="pointer btn" @click="gotoInformationPage">{{$t('customService.unauth.infoBtn')}}</span>
25 &nbsp;{{$t('customService.unauth.baseInfoTail')}}
26 </div>
17 27
18 <div v-if="showProfileInfo"> 28 <!-- <img class="pointer close" src="@/assets/images/common/icon-alert-close.png" alt=""> -->
19 <div class="alert"> 29 </div>
20 <img class="icon" src="@/assets/images/common/icon-alert-i.png" alt=""> 30 </div>
21 <div class="txt"> 31 <div class="empty-line" v-if="model!='suggest'"></div>
22 {{$t('customService.unauth.baseInfoTip')}}&nbsp; 32 </div>
23 <span class="pointer btn" @click="gotoInformationPage">{{$t('customService.unauth.infoBtn')}}</span>
24 &nbsp;{{$t('customService.unauth.baseInfoTail')}}
25 </div>
26
27 <!-- <img class="pointer close" src="@/assets/images/common/icon-alert-close.png" alt=""> -->
28 </div>
29 </div>
30 <div class="empty-line" v-if="model!='suggest'"></div>
31 </div>
32 </template> 33 </template>
33 34
34 <script src="./auth.js"></script> 35 <script src="./auth.js"></script>
......
1 1 /**
2 * 组件描述:理赔申请模态窗
3 * 主要用于不在保险范围内的提示
4 */
2 5
3 export default { 6 export default {
4 7
5 props: { 8 props: {
6 // 是否显示组件 9 // 是否显示组件
7 // 1、顯示事故類型；2、顯示時間 10 // 1、顯示事故類型；2、顯示時間
8 type: { 11 type: {
9 type: Number, 12 type: Number,
10 default: 2 13 default: 2
11 }, 14 },
12 }, 15 },
13 data() { 16 data() {
14 return { 17 return {
15 18 }
16 } 19 },
17 }, 20 components: {},
18 components: {}, 21 computed: {
19 computed: { 22 locale() {
20 locale() { 23 return this.$i18n.locale || 'tc';
21 return this.$i18n.locale || 'tc'; 24 },
22 }, 25 },
23 }, 26 methods: {
24 methods: { 27 initData() {
25 initData() {
26 28
27 }, 29 },
28 onOverLayHandler() { 30 onOverLayHandler() {
29 this.$emit("close"); 31 this.$emit("close");
30 }, 32 },
31 toContact() { 33 toContact() {
32 this.$emit("toContact"); 34 this.$emit("toContact");
33 this.$router.push({ 35 this.$router.push({
34 path: "/custom/service?q=m1" 36 path: "/custom/service?q=m1"
35 }); 37 });
36 } 38 }
37 }, 39 },
38 mounted() { 40 mounted() {
39 41
40 }, 42 },
41 created() { 43 created() {
42 this.initData(); 44 this.initData();
43 }, 45 },
44 watch: { 46 watch: {},
45 },
46 } 47 }
......
1 /**
2 * 组件描述:理赔申请模态窗
3 * 主要用于不在保险范围内的提示
4 */
5
1 export default { 6 export default {
2 data() { 7 data() {
3 return { 8 return {
......
1 /**
2 * 组件描述:申请索偿上传图片
3 */
4
1 import api from '@/api/api' 5 import api from '@/api/api'
2 import { 6 import {
3 httpGet, 7 httpGet,
...@@ -17,7 +21,7 @@ export default { ...@@ -17,7 +21,7 @@ export default {
17 // 是否显示组件 21 // 是否显示组件
18 options: { 22 options: {
19 type: Object, 23 type: Object,
20 default() { 24 default () {
21 return { 25 return {
22 // 名称 26 // 名称
23 name: "", 27 name: "",
...@@ -70,6 +74,7 @@ export default { ...@@ -70,6 +74,7 @@ export default {
70 }, 74 },
71 }, 75 },
72 methods: { 76 methods: {
77 // 初始化缓存
73 initData() { 78 initData() {
74 for (let index = 0; index < sessionStorage.length; index++) { 79 for (let index = 0; index < sessionStorage.length; index++) {
75 let key = sessionStorage.key(index); 80 let key = sessionStorage.key(index);
...@@ -87,10 +92,13 @@ export default { ...@@ -87,10 +92,13 @@ export default {
87 } 92 }
88 this.uploadFiles = this.images.length; 93 this.uploadFiles = this.images.length;
89 }, 94 },
95 // 缓存数据
90 cacheData() { 96 cacheData() {
91 for (let index = 0; index < this.images.length; index++) { 97 for (let index = 0; index < this.images.length; index++) {
92 let tmp = this.images[index]; 98 let tmp = this.images[index];
93 if (tmp.showMask || !tmp.cacheKey) { continue; } 99 if (tmp.showMask || !tmp.cacheKey) {
100 continue;
101 }
94 102
95 let key = "clarmImage." + this.options.imageTypeID + "." + index; 103 let key = "clarmImage." + this.options.imageTypeID + "." + index;
96 sessionStorage.setItem(key, JSON.stringify({ 104 sessionStorage.setItem(key, JSON.stringify({
...@@ -100,6 +108,7 @@ export default { ...@@ -100,6 +108,7 @@ export default {
100 })); 108 }));
101 } 109 }
102 }, 110 },
111 // 清除缓存
103 clearCache() { 112 clearCache() {
104 for (let index = 0; index < sessionStorage.length; index++) { 113 for (let index = 0; index < sessionStorage.length; index++) {
105 let key = sessionStorage.key(index); 114 let key = sessionStorage.key(index);
...@@ -110,6 +119,7 @@ export default { ...@@ -110,6 +119,7 @@ export default {
110 this.uploadFiles = 0; 119 this.uploadFiles = 0;
111 this.images = []; 120 this.images = [];
112 }, 121 },
122 // 选择多文件
113 selectMutilFile() { 123 selectMutilFile() {
114 if (this.uploading) { 124 if (this.uploading) {
115 return; 125 return;
...@@ -220,6 +230,7 @@ export default { ...@@ -220,6 +230,7 @@ export default {
220 this.$set(this, "images", images); 230 this.$set(this, "images", images);
221 this.refreshUploadNumber(); 231 this.refreshUploadNumber();
222 }, 232 },
233 // 生成随机AESKey
223 randomAesKey() { 234 randomAesKey() {
224 let chars = "0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z".split(","); 235 let chars = "0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z".split(",");
225 let res = ""; 236 let res = "";
...@@ -229,6 +240,7 @@ export default { ...@@ -229,6 +240,7 @@ export default {
229 } 240 }
230 return res; 241 return res;
231 }, 242 },
243 // 向父组件发送图片结果
232 emitResult() { 244 emitResult() {
233 if (this.images.length == 0) { 245 if (this.images.length == 0) {
234 let result = { 246 let result = {
...@@ -272,6 +284,7 @@ export default { ...@@ -272,6 +284,7 @@ export default {
272 onShowTipsOutHandler(event) { 284 onShowTipsOutHandler(event) {
273 this.tipsVisible = false; 285 this.tipsVisible = false;
274 }, 286 },
287 // 压缩图片
275 compressImage(src, callback) { 288 compressImage(src, callback) {
276 var img = new Image(); 289 var img = new Image();
277 img.src = src; 290 img.src = src;
...@@ -283,7 +296,7 @@ export default { ...@@ -283,7 +296,7 @@ export default {
283 scale = w / h; 296 scale = w / h;
284 w = w < 50 ? w : 50; 297 w = w < 50 ? w : 50;
285 h = (w / scale); 298 h = (w / scale);
286 var quality = 0.7; // 默认图片质量为0.7 299 var quality = 0.7; // 默认图片质量为0.7
287 //生成canvas 300 //生成canvas
288 var canvas = document.createElement('canvas'); 301 var canvas = document.createElement('canvas');
289 var ctx = canvas.getContext('2d'); 302 var ctx = canvas.getContext('2d');
...@@ -302,9 +315,6 @@ export default { ...@@ -302,9 +315,6 @@ export default {
302 callback(base64); 315 callback(base64);
303 } 316 }
304 }, 317 },
305 datePickCompleteHandler() {
306
307 }
308 }, 318 },
309 watch: { 319 watch: {
310 320
...@@ -312,5 +322,5 @@ export default { ...@@ -312,5 +322,5 @@ export default {
312 mounted() { 322 mounted() {
313 this.initData(); 323 this.initData();
314 }, 324 },
315 created() { } 325 created() {}
316 } 326 }
......
1 import { mapState } from "vuex"; 1 /**
2 * 组件描述:申请索偿申请组件
3 */
4
5
6 import {
7 mapState
8 } from "vuex";
2 import api from '@/api/api' 9 import api from '@/api/api'
3 import { 10 import {
4 httpGet, 11 httpGet,
5 httpPost, 12 httpPost,
6 formdata 13 formdata
7 } from '@/api/fetch-api.js' 14 } from '@/api/fetch-api.js'
8 15
9 import { getPolicyIdTypeList } from '@/utils/biz.js'; 16 import {
17 getPolicyIdTypeList
18 } from '@/utils/biz.js';
10 import Vue from 'vue'; 19 import Vue from 'vue';
11 import DatePicker from '@/components/date-picker/date-picker.vue'; 20 import DatePicker from '@/components/date-picker/date-picker.vue';
12 import { Loading } from 'vant'; 21 import {
13 import { Select, Option } from 'element-ui'; 22 Loading
23 } from 'vant';
24 import {
25 Select,
26 Option
27 } from 'element-ui';
14 28
15 import { ddMMyyyy2yyyyMMdd } from '@utils/utils.js'; 29 import {
30 ddMMyyyy2yyyyMMdd
31 } from '@utils/utils.js';
16 32
17 Vue.use(Select); 33 Vue.use(Select);
18 Vue.use(Option); 34 Vue.use(Option);
19 Vue.use(Loading); 35 Vue.use(Loading);
20 36
21 export default { 37 export default {
22 data() { 38 data() {
23 return { 39 return {
24 birthdayIllegal: false, 40 birthdayIllegal: false,
25 loading: false, 41 loading: false,
26 showTips: false, 42 showTips: false,
27 data: { 43 data: {
28 // firstName: "珊珊", 44 // firstName: "珊珊",
29 // lastName: "王", 45 // lastName: "王",
30 // birthDate: "01-01-2000", 46 // birthDate: "01-01-2000",
31 // idNo: "84555455", 47 // idNo: "84555455",
32 // idType: "40" 48 // idType: "40"
33 49
34 firstName: "", 50 firstName: "",
35 lastName: "", 51 lastName: "",
36 birthDate: "", 52 birthDate: "",
37 idNo: "", 53 idNo: "",
38 idType: "" 54 idType: ""
39 } 55 }
40 } 56 }
41 }, 57 },
42 components: { 58 components: {
43 DatePicker 59 DatePicker
44 }, 60 },
45 computed: { 61 computed: {
46 ...mapState({ 62 ...mapState({
47 userInfo: state => state.userInfo, 63 userInfo: state => state.userInfo,
48 policyList: state => state.policyList 64 policyList: state => state.policyList
49 }), 65 }),
50 i18n() { 66 i18n() {
51 return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {}; 67 return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {};
52 }, 68 },
53 policyIdTypeList() { 69 policyIdTypeList() {
54 return getPolicyIdTypeList(this.$i18n.locale); 70 return getPolicyIdTypeList(this.$i18n.locale);
55 }, 71 },
56 btnDisabled() { 72 btnDisabled() {
57 let b1 = this.data.firstName ? false : true; 73 let b1 = this.data.firstName ? false : true;
58 let b2 = this.data.lastName ? false : true; 74 let b2 = this.data.lastName ? false : true;
59 let b3 = this.data.birthDate ? false : true; 75 let b3 = this.data.birthDate ? false : true;
60 let b4 = this.data.idType ? false : true; 76 let b4 = this.data.idType ? false : true;
61 let b5 = this.data.idNo ? false : true; 77 let b5 = this.data.idNo ? false : true;
62 let b6 = this.birthdayIllegal; 78 let b6 = this.birthdayIllegal;
63 return b1 || b2 || b3 || b4 || b5 || b6; 79 return b1 || b2 || b3 || b4 || b5 || b6;
64 } 80 }
65 }, 81 },
66 methods: { 82 methods: {
67 initData() { 83 initData() {
68 let dStr = sessionStorage.getItem("clarmsCheckForm"); 84 let dStr = sessionStorage.getItem("clarmsCheckForm");
69 sessionStorage.removeItem("clarmsCheckForm"); 85 sessionStorage.removeItem("clarmsCheckForm");
70 if (dStr) { 86 if (dStr) {
71 try { 87 try {
72 let d = JSON.parse(dStr); 88 let d = JSON.parse(dStr);
73 this.data = d; 89 this.data = d;
74 } catch (e) { 90 } catch (e) {
75 91
76 } 92 }
77 } 93 }
78 }, 94 },
79 cacheData() { 95 cacheData() {
80 let d = JSON.stringify(this.data); 96 let d = JSON.stringify(this.data);
81 sessionStorage.setItem("clarmsCheckForm", d); 97 sessionStorage.setItem("clarmsCheckForm", d);
82 }, 98 },
83 checkDate(data) { 99 checkDate(data) {
84 this.birthdayIllegal = data.disable; 100 this.birthdayIllegal = data.disable;
85 }, 101 },
86 toRegisterPage() { 102 toRegisterPage() {
87 this.$router.push({ 103 this.$router.push({
88 path: "/register" 104 path: "/register"
89 }); 105 });
90 }, 106 },
91 toLoginPage() { 107 toLoginPage() {
92 this.$router.push({ 108 this.$router.push({
93 path: "/login" 109 path: "/login"
94 }); 110 });
95 }, 111 },
96 toContactUs() { 112 toContactUs() {
97 this.cacheData(); 113 this.cacheData();
98 this.$router.push({ 114 this.$router.push({
99 path: "/custom/service?q=m1" 115 path: "/custom/service?q=m1"
100 }); 116 });
101 }, 117 },
102 handleConfirm() { 118 // 提交申请
103 if (this.btnDisabled) { 119 handleConfirm() {
104 return; 120 if (this.btnDisabled) {
105 } 121 return;
106 if (this.loading) { 122 }
107 return; 123 if (this.loading) {
108 } 124 return;
109 this.loading = true; 125 }
110 let param = JSON.parse(JSON.stringify(this.data)); 126 this.loading = true;
111 param.birthDate = ddMMyyyy2yyyyMMdd(param.birthDate); 127 let param = JSON.parse(JSON.stringify(this.data));
112 console.log(param); 128 param.birthDate = ddMMyyyy2yyyyMMdd(param.birthDate);
113 httpPost({ url: api.getCidByVerify, data: param }).then(res => { 129 console.log(param);
114 if (res) { 130 httpPost({
115 let cid = res; 131 url: api.getCidByVerify,
116 httpPost({ url: api.clarmsCustomerList, data: { cid: cid } }).then(res => { 132 data: param
117 this.loading = false; 133 }).then(res => {
118 if (res && res.insuredInfoList && res.insuredInfoList.length > 0) { 134 if (res) {
119 this.$emit("insuredInfoList", { cid: cid, list: res.insuredInfoList }); 135 let cid = res;
120 } else { 136 httpPost({
121 this.showTips = true; 137 url: api.clarmsCustomerList,
122 } 138 data: {
123 }).catch(e => { 139 cid: cid
124 this.loading = false; 140 }
125 this.showTips = true; 141 }).then(res => {
126 }); 142 this.loading = false;
127 } else { 143 if (res && res.insuredInfoList && res.insuredInfoList.length > 0) {
128 this.loading = false; 144 this.$emit("insuredInfoList", {
129 this.showTips = true; 145 cid: cid,
130 } 146 list: res.insuredInfoList
131 }).catch(e => { 147 });
132 this.loading = false; 148 } else {
133 }); 149 this.showTips = true;
134 } 150 }
135 }, 151 }).catch(e => {
136 watch: { 152 this.loading = false;
137 'data.firstName': function () { 153 this.showTips = true;
138 this.showTips = false; 154 });
139 }, 155 } else {
140 'data.lastName': function () { 156 this.loading = false;
141 this.showTips = false; 157 this.showTips = true;
142 }, 158 }
143 'data.birthDate': function () { 159 }).catch(e => {
144 this.showTips = false; 160 this.loading = false;
145 }, 161 });
146 'data.idNo': function () { 162 }
147 this.showTips = false; 163 },
148 }, 164 watch: {
149 'data.idType': function () { 165 'data.firstName': function () {
150 this.showTips = false; 166 this.showTips = false;
151 }, 167 },
152 }, 168 'data.lastName': function () {
153 mounted() { 169 this.showTips = false;
154 this.initData(); 170 },
155 }, 171 'data.birthDate': function () {
156 created() { } 172 this.showTips = false;
173 },
174 'data.idNo': function () {
175 this.showTips = false;
176 },
177 'data.idType': function () {
178 this.showTips = false;
179 },
180 },
181 mounted() {
182 this.initData();
183 },
184 created() {}
157 } 185 }
......
1 /**
2 * 页面描述:理赔页面
3 *
4 */
5
1 import { 6 import {
2 mapGetters, 7 mapGetters,
3 mapActions, 8 mapActions,
...@@ -196,5 +201,5 @@ export default { ...@@ -196,5 +201,5 @@ export default {
196 this.initData(); 201 this.initData();
197 202
198 }, 203 },
199 created() { } 204 created() {}
200 } 205 }
......