Skip to content

dev / pingan-life-index-pro

Go to a project
Toggle navigation
Toggle navigation pinning
3adfc471 by simon
Options

神兵bug修改 

去掉index-bk
1 parent 5b2e2e4b
Inline Side-by-side
Showing 19 changed files with 33 additions and 666 deletions
...@@ -7,5 +7,5 @@ VUE_APP_CONTENT_ENCRYPT_KEY = 'MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDA1SNj4qiOE ...@@ -7,5 +7,5 @@ VUE_APP_CONTENT_ENCRYPT_KEY = 'MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDA1SNj4qiOE
7 VUE_APP_CONTENT_ENCRYPT_SWITCH = true 7 VUE_APP_CONTENT_ENCRYPT_SWITCH = true
8 VUE_APP_ONE_ACCOUNT_CENTER_OFF = true 8 VUE_APP_ONE_ACCOUNT_CENTER_OFF = true
9 9
10 VUE_APP_HIDE_VHIS_MODAL_FLAG = 'Y' 10 VUE_APP_HIDE_VHIS_MODAL_FLAG = 'N'
11 VUE_APP_MOCK_DATA = true 11 VUE_APP_MOCK_DATA = true
......
...@@ -9,6 +9,7 @@ module.exports = { ...@@ -9,6 +9,7 @@ module.exports = {
9 Birthday: "Birthday", 9 Birthday: "Birthday",
10 SubmitSuccess: "Successfully submitted", 10 SubmitSuccess: "Successfully submitted",
11 Email: "Email", 11 Email: "Email",
12 Birth:"Date of birth",
12 }, 13 },
13 message: { 14 message: {
14 login: 'Login', 15 login: 'Login',
......
...@@ -9,6 +9,7 @@ module.exports = { ...@@ -9,6 +9,7 @@ module.exports = {
9 Birthday: "生日", 9 Birthday: "生日",
10 SubmitSuccess: "遞交申請成功", 10 SubmitSuccess: "遞交申請成功",
11 Email: "電郵", 11 Email: "電郵",
12 Birth:"出生日期",
12 }, 13 },
13 message: { 14 message: {
14 login: "Login", 15 login: "Login",
......
...@@ -9,6 +9,7 @@ module.exports = { ...@@ -9,6 +9,7 @@ module.exports = {
9 Birthday: "生日", 9 Birthday: "生日",
10 SubmitSuccess: "递交申请成功", 10 SubmitSuccess: "递交申请成功",
11 Email: "电邮", 11 Email: "电邮",
12 Birth:"出生日期",
12 }, 13 },
13 message: { 14 message: {
14 login: "登入", 15 login: "登入",
......
...@@ -17,7 +17,6 @@ import { ...@@ -17,7 +17,6 @@ import {
17 Option 17 Option
18 } from 'element-ui'; 18 } from 'element-ui';
19 19
20 import { ddMMyyyy2yyyyMMdd } from '@utils/utils.js';
21 20
22 Vue.use(Loading); 21 Vue.use(Loading);
23 Vue.use(Select); 22 Vue.use(Select);
...@@ -297,7 +296,7 @@ export default { ...@@ -297,7 +296,7 @@ export default {
297 insuredId: insured.insuredId, 296 insuredId: insured.insuredId,
298 policyId: policy.policyId, 297 policyId: policy.policyId,
299 // accidentTime: this.data.contactDate, 298 // accidentTime: this.data.contactDate,
300 accidentTime: ddMMyyyy2yyyyMMdd(this.data.contactDate), 299 accidentTime: this.data.contactDate,
301 applyReasonList: this.typeSelected.join(","), 300 applyReasonList: this.typeSelected.join(","),
302 treatmentAmount: this.data.amount, 301 treatmentAmount: this.data.amount,
303 imageList: imageList 302 imageList: imageList
...@@ -330,7 +329,7 @@ export default { ...@@ -330,7 +329,7 @@ export default {
330 return false; 329 return false;
331 } 330 }
332 // console.log("insured === ", insured); 331 // console.log("insured === ", insured);
333 var time = new Date(ddMMyyyy2yyyyMMdd(this.data.contactDate).replace(/\-/g, "/") + " 00:00:00").getTime(); 332 var time = new Date(this.data.contactDate.replace(/\-/g, "/") + " 00:00:00").getTime();
334 // var time = new Date(this.data.contactDate.replace(/\-/g, "/") + " 00:00:00").getTime(); 333 // var time = new Date(this.data.contactDate.replace(/\-/g, "/") + " 00:00:00").getTime();
335 for (let index = 0; index < insured.policyInfoList.length; index++) { 334 for (let index = 0; index < insured.policyInfoList.length; index++) {
336 let policy = insured.policyInfoList[index]; 335 let policy = insured.policyInfoList[index];
...@@ -355,7 +354,7 @@ export default { ...@@ -355,7 +354,7 @@ export default {
355 if (!insured.policyInfoList || insured.policyInfoList.length <= 0) { 354 if (!insured.policyInfoList || insured.policyInfoList.length <= 0) {
356 return false; 355 return false;
357 } 356 }
358 var time = new Date(ddMMyyyy2yyyyMMdd(this.data.contactDate).replace(/\-/g, "/") + " 00:00:00").getTime(); 357 var time = new Date(this.data.contactDate.replace(/\-/g, "/") + " 00:00:00").getTime();
359 for (let index = 0; index < insured.policyInfoList.length; index++) { 358 for (let index = 0; index < insured.policyInfoList.length; index++) {
360 let policy = insured.policyInfoList[index]; 359 let policy = insured.policyInfoList[index];
361 // 有效期为生效日至满期日+60天 360 // 有效期为生效日至满期日+60天
......
...@@ -108,7 +108,7 @@ ...@@ -108,7 +108,7 @@
108 <div class="down-arrow"></div> 108 <div class="down-arrow"></div>
109 <div class="cont"> 109 <div class="cont">
110 <div class="ipt-date"> 110 <div class="ipt-date">
111 <date-picker v-model="data.contactDate" :pluginActivity="pluginActivityHandler" :formatter="'dd-MM-yyyy'" :filtModel="['future']" :check="checkDate" :readonly="true" :cusStyle="{border:'none !important','background-color':'transparent !important','height':'58px', 'color':'#ff6839','font-weight':'bold','text-align': 'center'}"></date-picker> 111 <date-picker v-model="data.contactDate" :pluginActivity="pluginActivityHandler" :filtModel="['future']" :check="checkDate" :readonly="true" :cusStyle="{border:'none !important','background-color':'transparent !important','height':'58px', 'color':'#ff6839','font-weight':'bold','text-align': 'center'}"></date-picker>
112 </div> 112 </div>
113 </div> 113 </div>
114 </div> 114 </div>
......
...@@ -26,9 +26,6 @@ import { ...@@ -26,9 +26,6 @@ import {
26 Option 26 Option
27 } from 'element-ui'; 27 } from 'element-ui';
28 28
29 import {
30 ddMMyyyy2yyyyMMdd
31 } from '@utils/utils.js';
32 29
33 Vue.use(Select); 30 Vue.use(Select);
34 Vue.use(Option); 31 Vue.use(Option);
...@@ -125,7 +122,7 @@ export default { ...@@ -125,7 +122,7 @@ export default {
125 } 122 }
126 this.loading = true; 123 this.loading = true;
127 let param = JSON.parse(JSON.stringify(this.data)); 124 let param = JSON.parse(JSON.stringify(this.data));
128 param.birthDate = ddMMyyyy2yyyyMMdd(param.birthDate); 125 param.birthDate = param.birthDate;
129 console.log(param); 126 console.log(param);
130 httpPost({ 127 httpPost({
131 url: api.getCidByVerify, 128 url: api.getCidByVerify,
......
...@@ -64,7 +64,7 @@ ...@@ -64,7 +64,7 @@
64 <div class="ipt-wrap"> 64 <div class="ipt-wrap">
65 <div class="down-arrow"></div> 65 <div class="down-arrow"></div>
66 <div class="cont"> 66 <div class="cont">
67 <date-picker class="ipt-date" :formatter="'dd-MM-yyyy'" v-model="data.birthDate" :filtModel="['future']" :check="checkDate" :cusStyle="{border:'none !important','background-color':'transparent !important',height:'48px', padding:'0', color:'#606266'}"></date-picker> 67 <date-picker class="ipt-date" v-model="data.birthDate" :filtModel="['future']" :check="checkDate" :cusStyle="{border:'none !important','background-color':'transparent !important',height:'48px', padding:'0', color:'#606266'}"></date-picker>
68 </div> 68 </div>
69 </div> 69 </div>
70 </div> 70 </div>
......
...@@ -85,11 +85,11 @@ export default { ...@@ -85,11 +85,11 @@ export default {
85 sid: true 85 sid: true
86 }).then(res => { 86 }).then(res => {
87 this.hadLoadPolicy = true; 87 this.hadLoadPolicy = true;
88 if (!res || res.length == 0) { } else { 88 if (!res || res.length == 0) {} else {
89 this.$store.commit("CACHE_POLICY_LIST", res); 89 this.$store.commit("CACHE_POLICY_LIST", res);
90 this.checkIfShowPolicy(); 90 this.checkIfShowPolicy();
91 } 91 }
92 }).catch(e => { }); 92 }).catch(e => {});
93 } else { 93 } else {
94 this.checkIfShowPolicy(); 94 this.checkIfShowPolicy();
95 } 95 }
...@@ -138,11 +138,16 @@ export default { ...@@ -138,11 +138,16 @@ export default {
138 138
139 for (let index = 0; index < this.policyDetail.policyAcknowledges.length; index++) { 139 for (let index = 0; index < this.policyDetail.policyAcknowledges.length; index++) {
140 let policyAcknowledge = this.policyDetail.policyAcknowledges[index]; 140 let policyAcknowledge = this.policyDetail.policyAcknowledges[index];
141 /**
142 * policyAcknowledge.letterType
143 * 1 电子保单
144 * 5 冷静期通知书
145 */
141 switch (policyAcknowledge.letterType) { 146 switch (policyAcknowledge.letterType) {
142 case "1": 147 case "1":
143 this.policyDetail.letterNo1Id = policyAcknowledge.recordId; 148 this.policyDetail.letterNo1Id = policyAcknowledge.recordId;
144 break; 149 break;
145 case "2": 150 case "5":
146 this.policyDetail.letterNo2Id = policyAcknowledge.recordId; 151 this.policyDetail.letterNo2Id = policyAcknowledge.recordId;
147 break; 152 break;
148 } 153 }
...@@ -157,35 +162,24 @@ export default { ...@@ -157,35 +162,24 @@ export default {
157 let m = now.getMonth() + 1; 162 let m = now.getMonth() + 1;
158 let d = now.getDate(); 163 let d = now.getDate();
159 164
160 if (this.$i18n.locale == 'en') {
161 this.policyDetail.nowYmd2 = m > 10 ? m : "0" + m;
162 this.policyDetail.nowYmd1 = d > 10 ? d : "0" + d;
163 this.policyDetail.nowYmd3 = y;
164 } else {
165 this.policyDetail.nowYmd1 = y; 165 this.policyDetail.nowYmd1 = y;
166 this.policyDetail.nowYmd2 = m > 10 ? m : "0" + m; 166 this.policyDetail.nowYmd2 = m > 10 ? m : "0" + m;
167 this.policyDetail.nowYmd3 = d > 10 ? d : "0" + d; 167 this.policyDetail.nowYmd3 = d > 10 ? d : "0" + d;
168 }
169 168
170 if (this.policyDetail.activeDate) { 169 if (this.policyDetail.activeDate) {
171 let ymds = this.policyDetail.activeDate.split(" ")[0].split("-"); 170 let ymds = this.policyDetail.activeDate.split(" ")[0].split("-");
172 if (this.$i18n.locale == 'en') { 171
173 this.policyDetail.ymd1 = ymds[2];
174 this.policyDetail.ymd2 = ymds[1];
175 this.policyDetail.ymd3 = ymds[0];
176 } else {
177 this.policyDetail.ymd1 = ymds[0]; 172 this.policyDetail.ymd1 = ymds[0];
178 this.policyDetail.ymd2 = ymds[1]; 173 this.policyDetail.ymd2 = ymds[1];
179 this.policyDetail.ymd3 = ymds[2]; 174 this.policyDetail.ymd3 = ymds[2];
180 } 175 }
181 }
182 }).catch(err => { 176 }).catch(err => {
183 177
184 }); 178 });
185 }, 179 },
186 // 确认保单按钮 180 // 确认保单按钮
187 handleConfirmPolicy() { 181 handleConfirmPolicy() {
188 if(!this.checked) return; 182 if (!this.checked) return;
189 if (this.policyDetail) { 183 if (this.policyDetail) {
190 if (this.loading) { 184 if (this.loading) {
191 return; 185 return;
......
...@@ -247,7 +247,7 @@ $borderRadius:6px; ...@@ -247,7 +247,7 @@ $borderRadius:6px;
247 color: $cOrange2; 247 color: $cOrange2;
248 248
249 span { 249 span {
250 text-decoration: underline; 250 // text-decoration: underline;
251 } 251 }
252 } 252 }
253 } 253 }
......
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
7 <!-- <div class="close" @click="onOverLayHandler()"><img src="@/assets/images/vhis/close.png"></div> --> 7 <!-- <div class="close" @click="onOverLayHandler()"><img src="@/assets/images/vhis/close.png"></div> -->
8 <div class="modal"> 8 <div class="modal">
9 <div class="modal-content"> 9 <div class="modal-content">
10 <div class="title">{{$t('vhis.title')}}{{$t('vhis.titleAft')}}</div> 10 <div class="title">{{$t('vhis.title')}}</div>
11 <div class="statement"> 11 <div class="statement">
12 <div class="desc orange" :class="{'ltr-zero':locale == 'en'}">{{$t('vhis.desc1')}}</div> 12 <div class="desc orange" :class="{'ltr-zero':locale == 'en'}">{{$t('vhis.desc1')}}</div>
13 <div class="desc" :class="{'ltr-zero':locale == 'en'}">{{$t('vhis.desc2')}}</div> 13 <div class="desc" :class="{'ltr-zero':locale == 'en'}">{{$t('vhis.desc2')}}</div>
...@@ -128,8 +128,8 @@ ...@@ -128,8 +128,8 @@
128 <!-- <div class="submit-btn " @click="handleIgnorePolicy">{{$t('vhis.btn3')}}</div> --> 128 <!-- <div class="submit-btn " @click="handleIgnorePolicy">{{$t('vhis.btn3')}}</div> -->
129 </div> 129 </div>
130 <div class="flex-center contact"> 130 <div class="flex-center contact">
131 {{$t('vhis.tip4')}} 131
132 <span class="pointer" @click="toContact()">{{$t('vhis.tip5')}}</span> 132 <span class="pointer" @click="toContact()">{{$t('vhis.tip4')}}{{$t('vhis.tip5')}}</span>
133 </div> 133 </div>
134 </div> 134 </div>
135 </div> 135 </div>
......
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
2 2
3 .container { 3 .container {
4 // margin-top: -48px; 4 // margin-top: -48px;
5 font-size: $fontSize-M2;
5 6
6 .title { 7 .title {
7 text-align: center; 8 text-align: center;
...@@ -15,7 +16,6 @@ ...@@ -15,7 +16,6 @@
15 16
16 .desc { 17 .desc {
17 margin-top: 28px; 18 margin-top: 28px;
18 font-size: 22px;
19 19
20 &-item { 20 &-item {
21 @extend .bb; 21 @extend .bb;
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
26 26
27 // 问题 27 // 问题
28 .question { 28 .question {
29 font-weight: bold; 29 // font-weight: bold;
30 margin-bottom: 12px; 30 margin-bottom: 12px;
31 } 31 }
32 32
......
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
7 </div> 7 </div>
8 <div class="desc"> 8 <div class="desc">
9 <div @click="onMoreHandler(items)" class="desc-item" v-for="(items) in dataList" :key="items.id"> 9 <div @click="onMoreHandler(items)" class="desc-item" v-for="(items) in dataList" :key="items.id">
10 <div class="question">{{ items.q }}</div> 10 <div class="question" :class="{'bold':items.more}">{{ items.q }}</div>
11 <template v-if="items.more"> 11 <template v-if="items.more">
12 <template v-for="item in items.a"> 12 <template v-for="item in items.a">
13 <span v-if="item.type == 'text'" class="ql-editor answer" :key="item.id" v-html="item.content"></span> 13 <span v-if="item.type == 'text'" class="ql-editor answer" :key="item.id" v-html="item.content"></span>
......
...@@ -442,7 +442,7 @@ $borderSize: 6px; ...@@ -442,7 +442,7 @@ $borderSize: 6px;
442 min-height: 136px; 442 min-height: 136px;
443 443
444 .label { 444 .label {
445 font-weight: normal; 445 // font-weight: normal;
446 } 446 }
447 447
448 .val { 448 .val {
......
...@@ -119,15 +119,15 @@ ...@@ -119,15 +119,15 @@
119 </div> 119 </div>
120 <div class="table-item"> 120 <div class="table-item">
121 <div class="tt label">{{$t('genRich.guarantee1.k2')}}</div> 121 <div class="tt label">{{$t('genRich.guarantee1.k2')}}</div>
122 <div class="tt val">{{$t('genRich.guarantee1.v2')}}</div> 122 <div class="tt val text-c">{{$t('genRich.guarantee1.v2')}}</div>
123 </div> 123 </div>
124 <div class="table-item"> 124 <div class="table-item">
125 <div class="tt label">{{$t('genRich.guarantee1.k3')}}</div> 125 <div class="tt label">{{$t('genRich.guarantee1.k3')}}</div>
126 <div class="tt val">{{$t('genRich.guarantee1.v3')}}</div> 126 <div class="tt val text-c">{{$t('genRich.guarantee1.v3')}}</div>
127 </div> 127 </div>
128 <div class="table-item"> 128 <div class="table-item">
129 <div class="tt label">{{$t('genRich.guarantee1.k4')}}</div> 129 <div class="tt label">{{$t('genRich.guarantee1.k4')}}</div>
130 <div class="tt val">{{$t('genRich.guarantee1.v4')}}</div> 130 <div class="tt val text-c">{{$t('genRich.guarantee1.v4')}}</div>
131 </div> 131 </div>
132 <div class="table-item"> 132 <div class="table-item">
133 <div class="tt label">{{$t('genRich.guarantee1.k5')}}</div> 133 <div class="tt label">{{$t('genRich.guarantee1.k5')}}</div>
......
1 /**
2 * 页面描述:官网首页
3 */
4
5
6 import api from '@/api/api';
7 import {
8 httpGet,
9 httpPost
10 } from '@/api/fetch-api.js';
11 import {
12 mapGetters,
13 mapActions,
14 mapState
15 } from "vuex";
16 var UA = require("ua-device");
17
18 export default {
19 data() {
20 return {
21 key: 'value',
22 // swiper
23 swiperOption: {
24 navigation: {
25 nextEl: '.swiper-button-next',
26 prevEl: '.swiper-button-prev'
27 },
28 pagination: {
29 el: '.swiper-pagination',
30 clickable: true,
31 },
32 autoplay: {
33 delay: 5000,
34 stopOnLastSlide: false,
35 disableOnInteraction: false
36 },
37 speed: 1000,
38 },
39 bannerList: [],
40 bannerCandidateList: [],
41 // 视频
42 playerOptions: {},
43
44 }
45 },
46 components: {},
47 computed: {
48 ...mapState({
49 isSmallScreen: state => state.isSmallScreen,
50 isMobile: state => state.isMobile
51 }),
52 locale() {
53 return this.$i18n.locale || 'tc';
54 },
55 i18n() {
56 return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {};
57 },
58 player() {
59 return this.$refs.videoPlayer.player
60 },
61
62 },
63 methods: {
64 toVhis() {
65 // gotoVHIS(this.locale);
66 this.$router.push({
67 path: "/vhis",
68 query: {
69 p: "VHIS001"
70 }
71 });
72 },
73 /**
74 * 推荐产品
75 */
76 onRecommendHandler(val) {
77 if (val == 1) {
78 this.toVhis();
79 }
80 if (val == 2) {
81 this.$router.push({
82 path: "/custom/service?q=m6"
83 })
84 }
85 if (val == 3) {
86 this.$router.push({
87 path: "/custom/product"
88 })
89 }
90 if (val == 4) {
91 this.$router.push({
92 path: "/news/list"
93 })
94 }
95
96 },
97
98 /**
99 * 推荐产品
100 */
101 onMoreNewsHandler() {
102 this.$router.push({
103 path: "/news/list"
104 })
105 },
106
107 /**
108 * 去新闻详情页面
109 * 需要带id
110 */
111 toNewsDetail() {
112 this.$router.push({
113 path: '/news/detail'
114 })
115 },
116 toProfile() {
117 this.$router.push({
118 path: '/profile'
119 })
120 },
121 refreshVideoPlayer() {
122 let videoUrl = sessionStorage.getItem("_video_url");
123 let posterUrl = sessionStorage.getItem("_poster_url");
124 let playerOptions = {
125 width: 800,
126 height: 450,
127 // aspectRatio: '16:9', // 将播放器置于流畅模式，并在计算播放器的动态大小时使用该值。值应该代表一个比例 - 用冒号分隔的两个数字（例如"16:9"或"4:3"）
128 autoplay: false, //如果true,浏览器准备好时开始回放。
129 muted: true, // 默认情况下将会消除任何音频。
130 language: 'en',
131 // playbackRates: [0.7, 1.0, 1.5, 2.0],//播放速度
132 sources: [{
133 type: "video/mp4",
134 // mp4
135 src: videoUrl,
136 // webm
137 // src: "https://cdn.theguardian.tv/webM/2015/07/20/150716YesMen_synd_768k_vp8.webm"
138 }],
139 poster: posterUrl,
140 controlBar: {
141 timeDivider: true,
142 durationDisplay: true,
143 remainingTimeDisplay: false,
144 fullscreenToggle: true //全屏按钮
145 }
146 }
147 let output = new UA(navigator.userAgent);
148 let deviceType = output.device.type;
149 let isMobile = deviceType == "mobile";
150 // if (this.isSmallScreen) {
151 if (isMobile) {
152 playerOptions.aspectRatio = "16:9";
153 }
154 this.playerOptions = playerOptions;
155 },
156 initData() {
157 this.fetchBanner().then(res => {
158 this.bannerCandidateList = res;
159 this.refreshBanner();
160 });
161 this.fetchIndexVideo().then(res => {
162 this.refreshVideoPlayer();
163 });
164 // if (!this.isMobile) {
165 // window.addEventListener('resize', () => this.refreshVideoPlayer(), false);
166 // }
167 },
168 fetchBanner() {
169 return new Promise((resolve, reject) => {
170 httpPost({
171 url: api.banner
172 }).then(res => {
173 resolve(res);
174 });
175 });
176 },
177 fetchIndexVideo() {
178 return new Promise((resolve, reject) => {
179 httpPost({
180 url: api.indexVideo
181 }).then(res => {
182 sessionStorage.setItem("_video_url", res.videoUrl);
183 sessionStorage.setItem("_poster_url", res.posterUrl);
184 resolve(res);
185 });
186 });
187 },
188 refreshBanner() {
189 let key = this.locale;
190 if (key == "zh") {
191 key = "cn";
192 }
193 let bannerList = [];
194 this.bannerCandidateList.forEach(element => {
195 bannerList.push(element[key]);
196 });
197 this.$set(this, 'bannerList', bannerList);
198 },
199 btnNavigateTo(type, link) {
200 switch (type) {
201 case "none":
202 break;
203 case "news":
204 this.$router.push({
205 path: "/news/detail",
206 query: {
207 c: link
208 }
209 });
210 break;
211 case "product":
212 break;
213 case "vhis":
214 this.$router.push({
215 path: "/vhis",
216 query: {
217 p: link
218 }
219 });
220 break;
221 default:
222 location.href = link;
223 break;
224 }
225 }
226 },
227 beforeDestroy() {
228 // window.removeEventListener('resize', this.refreshVideoPlayer(), false);
229 },
230 mounted() {
231 this.initData();
232
233 setTimeout(() => {
234 // console.log("queryConfigData:", this.$root.queryConfigData);
235 // console.log("queryConfigData:", window.vueInstance.queryConfigData); // 挂载到windows的访问方法
236 // 放localStorage直接是localStorage.getItem("queryConfig");
237 }, 3000)
238 },
239
240 created() {
241
242 this.$root.eventBus.$on("langChange", () => {
243 try {
244 this.refreshBanner();
245 } catch (e) { }
246 });
247 }
248
249 }
1 @import '@/styles/_support.scss';
2
3 .content {
4 padding-bottom: 27px;
5 }
6
7 .top-space {
8 height: 27px;
9 }
10
11 .box {
12 position: relative;
13 margin-top: $marginMedium;
14 }
15
16 // banner 轮播
17 .banner-contaner {
18 width: 100%;
19 height: 470px;
20 margin: 0 auto;
21 position: relative;
22 z-index: 1;
23 overflow: hidden;
24 }
25
26 // PC轮播
27 .banner-pc {
28 display: block;
29 position: absolute;
30 z-index: 1;
31 left: 50%;
32 margin-left: -960px;
33 top: 0;
34 width: 1920px;
35 height: 100%;
36 overflow: hidden;
37
38 .banner-img {
39 width: 100%;
40 height: 100%;
41 }
42
43 .btn-wrap {
44 position: absolute;
45 z-index: 1;
46 // 两个banner图按钮位置不一样，和原先约定的按钮位置固定不一致
47 // 如要调整位置，请调整top,right。如需要右对齐请使用right
48 // 已用padding适应文本过长的情况(英文等);
49 // top: 272px;
50 // left: 1228px;
51 // top: 310px;
52 top: 295px;
53 right: 432px;
54 display: flex;
55
56 .banner-btn {
57 @extend .pointer;
58 @extend .bb;
59 @include btc2(126px, 48px, $fontSizeTitle);
60 width: auto;
61 padding: 0 24px;
62 min-width: 126px;
63 margin-left: 12px;
64 background-image: none;
65 }
66 }
67 }
68
69 // 移动端轮播
70 .banner-mobile {
71 display: none;
72
73 .banner-img {
74 width: 100%;
75 }
76
77 .btn-wrap {
78 position: absolute;
79 z-index: 1;
80 top: 87%;
81 left: 0;
82 right: 0;
83 margin: 0 auto;
84 display: flex;
85 justify-content: center;
86
87 .banner-btn {
88 @extend .pointer;
89 padding: 0 12px;
90 color: $cOrange;
91 }
92 }
93 }
94
95 // 推荐产品
96 .recommend {
97 display: flex;
98 text-align: center;
99 justify-content: space-between;
100 flex-wrap: wrap;
101
102 &-item {
103 @extend .bb;
104
105 margin-right: $marginSmall;
106
107 &:last-child {
108 margin-right: 0;
109 }
110
111
112 position: relative;
113 width: 291px;
114 // width: 100%;
115 height: 393px;
116 border-radius: $borderRadiusSmall;
117 @extend .box-shadow;
118 background-color: #fbfbfb;
119
120 .img {
121 width: 100%;
122 height: 291px;
123 background-size: cover;
124 }
125
126 .img1 {
127 background: url("~@/assets/images/index/recommend-1.png") no-repeat center;
128 background-size: cover;
129 }
130
131 .img2 {
132 background: url("~@/assets/images/index/recommend-2.png") no-repeat center;
133 background-size: cover;
134 }
135
136 .img3 {
137 background: url("~@/assets/images/index/recommend-3.png") no-repeat center;
138 background-size: cover;
139 }
140
141 .img4 {
142 background: url("~@/assets/images/index/recommend-4.png") no-repeat center;
143 background-size: cover;
144 }
145
146
147 .btn {
148 position: absolute;
149 left: 0;
150 right: 0;
151 bottom: 36px;
152 margin: 0 auto;
153
154 @include btc2(162px, 48px, 16px);
155 }
156
157 img {
158 width: 100%;
159 @include border-top-radius($borderRadius);
160 }
161
162 &:first-child {
163 padding-left: 0;
164 }
165
166 &:last-child {
167 padding-right: 0;
168 }
169 }
170 }
171
172 // 详情
173 .detail {
174 display: flex;
175 max-width: 1200px;
176
177
178 .txt {
179 position: relative;
180 @extend .fcc;
181 @extend .bb;
182 @include ellipsis(14);
183 padding-left: 26px;
184 flex: 1;
185 line-height: 2.3;
186
187 }
188
189 .txt:lang(zh) {
190 letter-spacing: 1.4px;
191 }
192 }
193
194
195 .swiper-button-prev {
196 background-image: url('~@/assets/images/common/button-prev.png');
197 left: 360px;
198
199 }
200
201 .swiper-button-next {
202 background-image: url('~@/assets/images/common/button-next.png');
203 right: 360px;
204 }
205
206 .swiper-container {
207 height: 100%;
208 }
209
210 .swiper-pagination-fraction,
211 .swiper-pagination-custom,
212 .swiper-container-horizontal>.swiper-pagination-bullets {
213 bottom: 48px;
214 }
215
216 .swiper-pagination-bullet {
217 width: 12px;
218 height: 12px;
219 background-color: #dcdddd;
220 }
221
222 .swiper-pagination-bullet-active {
223 width: 12px;
224 height: 12px;
225 background-color: $cOrange;
226 }
227
228 .box-shadow {
229 box-shadow: 0 0 18px 0 rgba(255, 87, 0, 0.15);
230 }
231
232 @media (max-width: 1200px) {
233 .content {
234 @include content-percent();
235 }
236
237 // 推荐产品
238 .recommend {
239 justify-content: center;
240
241 &-item {
242 width: 46% !important;
243 padding: 0 !important;
244 margin: 2% !important;
245 }
246 }
247
248 // 详情
249 .detail {
250 display: block;
251
252 .vjs-custom-skin {
253 width: 100%;
254 }
255
256
257 .txt {
258 padding: 0;
259 margin: $marginSmall 0 $marginMedium;
260 }
261 }
262 }
263
264
265 @media (max-width: 768px) {
266 .content {}
267
268 .banner-contaner {
269 height: auto;
270 }
271
272 .banner-pc {
273 display: none;
274 }
275
276 .banner-mobile {
277 display: block;
278 }
279
280 // 推荐产品
281 .recommend {
282 &-item {
283 width: 100% !important;
284 margin: $marginSmall-M auto !important;
285 }
286 }
287
288 .box-shadow {
289 box-shadow: none;
290 }
291
292 .swiper-pagination-fraction,
293 .swiper-pagination-custom,
294 .swiper-container-horizontal>.swiper-pagination-bullets {
295 bottom: 2px;
296 }
297
298 }
1
2 <template>
3 <div class="page page-index">
4 <div class="banner-contaner">
5 <!-- banner 轮播 -->
6
7 <div class="banner banner-pc">
8 <swiper :options="swiperOption">
9 <swiper-slide v-for="(item,index) in bannerList" :key="index">
10 <img class="banner-img" :src="item.pcBannerUrl">
11 <div class="btn-wrap">
12 <div v-for="(btnItem, btnIndex) in item.btns" :key="btnIndex">
13 <div class="banner-btn" v-if="btnItem.n && btnItem.t && btnItem.c" @click="btnNavigateTo(btnItem.t,btnItem.l)" :style="{backgroundColor:btnItem.c}">{{btnItem.n}}</div>
14 </div>
15 </div>
16 </swiper-slide>
17 <div class="swiper-button-prev" slot="button-prev"></div>
18 <div class="swiper-button-next" slot="button-next"></div>
19 <div class="swiper-pagination" slot="pagination"></div>
20 </swiper>
21 </div>
22
23 <div class="banner banner-mobile">
24 <swiper class="swiper" :options="swiperOption">
25 <swiper-slide v-for="(item,index) in bannerList" :key="index">
26 <img class="banner-img" :src="item.mobileBannerUrl">
27 <div class="btn-wrap">
28 <div class="banner-btn" v-for="(btnItem, btnIndex) in item.btns" :key="btnIndex" @click="btnNavigateTo(btnItem.t,btnItem.l)" :style="{color:btnItem.c}">{{btnItem.n}}&nbsp;&gt;</div>
29 </div>
30 </swiper-slide>
31 <div class="swiper-pagination" slot="pagination"></div>
32 </swiper>
33 </div>
34
35 <!-- <div class="swiper-button-prev" slot="button-prev"></div>
36 <div class="swiper-button-next" slot="button-next"></div> -->
37 </div>
38 <div class="content">
39 <!-- 推荐产品 -->
40 <div class="box recommend gird-g">
41 <div class="recommend-item pure-u-1 pure-u-md-1-2">
42 <div @click="onRecommendHandler(1)" class="btn pointer">{{$t('index.recommend.t1')}}</div>
43 <div class="img img1"></div>
44 </div>
45 <div class="recommend-item pure-u-1 pure-u-md-1-2">
46 <div @click="onRecommendHandler(3)" class="btn pointer">{{$t('index.recommend.t2')}}</div>
47 <div class="img img2"></div>
48 </div>
49 <div class="recommend-item pure-u-1 pure-u-md-1-2">
50 <div @click="onRecommendHandler(1)" class="btn pointer">{{$t('index.recommend.t3')}}</div>
51 <div class="img img3"></div>
52 </div>
53 <div class="recommend-item pure-u-1 pure-u-md-1-2">
54 <div @click="onRecommendHandler(4)" class="btn pointer">{{$t('index.recommend.t4')}}</div>
55 <div class="img img4"></div>
56 </div>
57 </div>
58 <!-- 详情 -->
59 <div class="box detail">
60 <video-player class="vjs-custom-skin" ref="videoPlayer" :options="playerOptions" :playsinline="true">
61 </video-player>
62 <div v-if="$i18n.locale == 'zh'" class="txt">
63 中国平安人寿保险股份有限公司成立于2002年,是中国平安保险（集团）股份有限公司旗下的重要成员。截至2017年12月31日,平安人寿注册资本为338亿元，在全国拥有42家分公司（含7家电话销售中心）及超过3,300个营业网点,寿险代理人达138.6万名。公司个险、银保、电销、互联网多渠道齐头并进，实现协同发展，运营管理水平及客户体验领先市场，并依托集团“金融+科技”双驱动战略，在合规经营、防范风险的前提下，开启平台经营新时代，持续提升产品、科技两大核心竞争力，推动内含价值及规模持续、健康、稳定增长。
64 </div>
65 <div v-else-if="$i18n.locale == 'tc'" class="txt">
66 中國平安人壽保險股份有限公司成立於2002年,是中國平安保險（集團）股份有限公司旗下的重要成員。截至2017年12月31日,平安人壽註冊資本為338億元，在全國擁有42家分公司（含7家電話銷售中心）及超過3,300個營業網點,壽險代理人達138.6萬名。公司個險、銀保、電銷、互聯網多渠道齊頭並進，實現協同發展，運營管理水平及客戶體驗領先市場，並依托集團“金融+科技”雙驅動戰略，在合規經營、防範風險的前提下，開啟平臺經營新時代，持續提升產品、科技兩大核心競爭力，推動內含價值及規模持續、健康、穩定增長。
67 </div>
68 <div v-else class="txt">
69 Ping An Life Insurance Co., Ltd. of China was founded in 2002. It is an important member of Ping An insurance (Group) Co., Ltd. As of December 31, 2017, Ping An life had a registered capital of 33.8 billion yuan. It has 42 branches (including 7 telemarketing centers) and more than 3300 business outlets nationwide, with 1.386 million life insurance agents. The company's personal insurance, bancassurance, telemarketing and Internet multi-channel go hand in hand to achieve coordinated development, leading the market in operation and management level and customer experience, and relying on the group's "Finance + technology" dual drive strategy, under the premise of compliant operation and risk prevention, to open a new era of platform operation, continuously improve the two core competitiveness of products and technology, and promote the sustainability of embedded value and scale Healthy and stable growth.
70 </div>
71 </div>
72 </div>
73 </div>
74 </template>
75
76 <script src="./index.js"></script>
77 <style lang="scss" scoped>
78 @import "./index.scss";
79 </style>
...@@ -133,12 +133,12 @@ ...@@ -133,12 +133,12 @@
133 </div> 133 </div>
134 </div> 134 </div>
135 <div class="func1-item"> 135 <div class="func1-item">
136 <div class="k">{{$t('common.Birthday')}}</div> 136 <div class="k">{{$t('common.Birth')}}</div>
137 <div class="age"> 137 <div class="age">
138 <div class="ipt-wrap-linear"> 138 <div class="ipt-wrap-linear">
139 <div class="down-arrow"></div> 139 <div class="down-arrow"></div>
140 <div class="cont"> 140 <div class="cont">
141 <date-picker class="ipt-date" :placeholder="$t('common.Birthday') + '*'" v-model="quoteData.birthday" :filtModel="['future']" :cusStyle="{ 141 <date-picker class="ipt-date" :placeholder="$t('common.Birth') + '*'" v-model="quoteData.birthday" :filtModel="['future']" :cusStyle="{
142 border: 'none !important', 142 border: 'none !important',
143 'background-color': 'transparent !important', 143 'background-color': 'transparent !important',
144 padding: '16px 24px', 144 padding: '16px 24px',
......