Skip to content
Toggle navigation
Toggle navigation
This project
Loading...
Sign in
dev
/
pingan-life-index-pro
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Pipelines
Graphs
Issues
0
Merge Requests
0
Wiki
Network
Create a new issue
Builds
Commits
Issue Boards
Files
Commits
Network
Compare
Branches
Tags
3368a543
authored
2020-05-16 15:56:29 +0800
by
simon
Browse Files
Options
Browse Files
Tag
Download
Email Patches
Plain Diff
nav分段样式
1 parent
79d71512
Show whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
34 additions
and
50 deletions
src/pages/index/index.js
src/pages/index/index.scss
src/pages/index/index.vue
src/pages/index/index.js
View file @
3368a54
...
...
@@ -39,33 +39,6 @@ export default {
bannerCandidateList
:
[],
// 导航菜单
// dataList: [
// {
// name: "平安“好e時”<br>自願醫保標準計劃",
// url: "",
// index: 0
// },
// {
// name: "「平安 ‧ 傳家福<br>分紅終身壽險計劃",
// url: "",
// index: 1
// },
// {
// name: "Ping An 'Pro Easy'<br>VHIS Standard Plan",
// url: "",
// index: 2
// },
// {
// name: "Ping An GenRich<br>Insurance Plan",
// url: "",
// index: 3
// },
// {
// name: "Ping An 'Pro Easy'<br>VHIS Standard Plan",
// url: "",
// index: 4
// }
// ],
curTab
:
{},
// 投保
...
...
@@ -110,7 +83,7 @@ export default {
let
result
=
{};
let
mar
=
0
;
// 两边缩进
let
ind
=
0
;
// 缩进简介
let
wid
=
0
;
let
wid
=
24
0
;
let
dataList
=
this
.
dataList
;
let
len
=
dataList
.
length
;
switch
(
len
)
{
...
...
@@ -152,23 +125,10 @@ export default {
ind
,
wid
};
console
.
log
(
"result:"
,
result
);
return
result
;
},
// tabClassObject() {
// return {
// active: this.isActive && !this.error,
// 'text-danger': this.error && this.error.type === 'fatal'
// }
// }
// tableTapOpt(){
// let result = {
// width:
// }
// },
},
methods
:
{
// fetchBanner() {
// return new Promise((resolve, reject) => {
// httpPost({
...
...
@@ -275,7 +235,6 @@ export default {
sid
:
true
}).
then
((
result
)
=>
{
this
.
dataList
=
[];
// console.log("11111");
result
.
forEach
(
element
=>
{
let
content
=
JSON
.
parse
(
element
.
content
);
let
item
=
{}
...
...
@@ -292,6 +251,12 @@ export default {
}
this
.
dataList
.
push
(
item
);
});
// 增加一个tap
// this.dataList.push(JSON.parse(JSON.stringify(this.dataList[0])));
// this.dataList.push(JSON.parse(JSON.stringify(this.dataList[0])));
// this.dataList.push(JSON.parse(JSON.stringify(this.dataList[0])));
this
.
dataList
.
forEach
((
element
,
idx
)
=>
{
element
.
index
=
idx
;
element
.
describeList
=
element
.
describe
.
split
(
"\n"
);
...
...
src/pages/index/index.scss
View file @
3368a54
...
...
@@ -104,23 +104,34 @@
.nav-tab
{
min-height
:
100px
;
display
:
flex
;
justify-content
:
center
;
font-size
:
22px
;
text-align
:
center
;
font-weight
:
bold
;
color
:
$cOrange2
;
max-width
:
1200px
;
// max-width: 1200px;
width
:
100%
;
margin
:
0
auto
;
&
-item
{
@extend
.bb
;
@extend
.fcc
;
border-right
:
solid
2px
#ffffff
;
cursor
:
pointer
;
color
:
#ff6839
;
color
:
$cOrange2
;
background-color
:
#fff1ed
;
padding
:
12px
30px
;
&
:last-child
{
border-right
:
none
;
flex
:
1
;
justify-content
:
flex-start
;
}
&
:first-child
{
flex
:
1
;
justify-content
:
flex-end
;
}
}
...
...
@@ -251,11 +262,11 @@
margin-left
:
-120px
;
&
:first-child
{
margin-left
:
0
;
&
:first-child
{
margin-left
:
0
;
}
&
:last-child
{
&
:last-child
{
filter
:
none
;
}
...
...
@@ -613,6 +624,12 @@
width
:
100%
!
important
;
border-right
:
none
;
border-bottom
:
solid
2px
#ffffff
;
&
:first-child
{
justify-content
:
center
;
}
&
:last-child
{
justify-content
:
center
;
}
}
}
...
...
@@ -649,6 +666,7 @@
.nav-tab
{
font-size
:
$fontSize-M2
;
&
-item
{
}
}
...
...
src/pages/index/index.vue
View file @
3368a54
...
...
@@ -35,11 +35,12 @@
<!--
<div
class=
"swiper-button-prev"
slot=
"button-prev"
></div>
<div
class=
"swiper-button-next"
slot=
"button-next"
></div>
-->
</div>
<!-- 导航菜单切换 -->
<div
class=
"nav-tab"
>
<div
class=
"nav-tab-item"
:class=
"
{ 'nav-tab-item-act': item.index == curTab.index }" :style="'width: calc(1200px / ' + dataList.length + ');'" @click="onTabHandler(item)" v-html="item.tabName" v-for="item in dataList" :key="item.id">
{{
item
.
tabName
}}
</div>
<!--
<div
class=
"nav-tab-item"
:class=
"
{ 'nav-tab-item-act': item.index == curTab.index }" :style="'width: calc(100% / ' + dataList.length + '); '+ (index == dataList.length-1 ?'':'width:50%;') +' '" @click="onTabHandler(item)" v-html="item.tabName" v-for="item in dataList" :key="item.id">
{{
item
.
tabName
}}
</div>
-->
<div
class=
"gird-g nav-tab"
>
<div
class=
"nav-tab-item"
:class=
"
{ 'nav-tab-item-act': item.index == curTab.index }" :style="'width: calc(100% / ' + dataList.length + ');'" @click="onTabHandler(item)" v-html="item.tabName" v-for="item in dataList" :key="item.id">
{{
item
.
tabName
}}
</div>
<!--
<div
class=
"nav-tab-item pure-u-1 pure-u-md-1-5"
:class=
"
{ 'nav-tab-item-act': item.index == curTab.index }" @click="onTabHandler(item)" v-html="item.tabName" v-for="item in dataList" :key="item.id" >
{{
item
.
tabName
}}
</div>
-->
</div>
<!-- 推荐 为什么选择平安人寿 -->
...
...
Please
register
or
sign in
to post a comment