Commit d99b7100 authored by 李晓兵's avatar 李晓兵

'修改经销商tab'

parent 0b515388
src/assets/distributorSign/check1.png

7.16 KB | W: | H:

src/assets/distributorSign/check1.png

7.37 KB | W: | H:

src/assets/distributorSign/check1.png
src/assets/distributorSign/check1.png
src/assets/distributorSign/check1.png
src/assets/distributorSign/check1.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/distributorSign/check2.png

8.09 KB | W: | H:

src/assets/distributorSign/check2.png

8.2 KB | W: | H:

src/assets/distributorSign/check2.png
src/assets/distributorSign/check2.png
src/assets/distributorSign/check2.png
src/assets/distributorSign/check2.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/distributorSign/uncheck1.png

8.27 KB | W: | H:

src/assets/distributorSign/uncheck1.png

8.37 KB | W: | H:

src/assets/distributorSign/uncheck1.png
src/assets/distributorSign/uncheck1.png
src/assets/distributorSign/uncheck1.png
src/assets/distributorSign/uncheck1.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/distributorSign/uncheck2.png

6.19 KB | W: | H:

src/assets/distributorSign/uncheck2.png

9.33 KB | W: | H:

src/assets/distributorSign/uncheck2.png
src/assets/distributorSign/uncheck2.png
src/assets/distributorSign/uncheck2.png
src/assets/distributorSign/uncheck2.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/distributorSign/unsign.png

2.34 KB | W: | H:

src/assets/distributorSign/unsign.png

8.95 KB | W: | H:

src/assets/distributorSign/unsign.png
src/assets/distributorSign/unsign.png
src/assets/distributorSign/unsign.png
src/assets/distributorSign/unsign.png
  • 2-up
  • Swipe
  • Onion skin
...@@ -166,8 +166,8 @@ export default { ...@@ -166,8 +166,8 @@ export default {
height: 86px; height: 86px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-evenly; justify-content: space-around;
padding: 4px 0;
.option { .option {
width: 100%; width: 100%;
height: 18px; height: 18px;
......
...@@ -40,12 +40,21 @@ export default { ...@@ -40,12 +40,21 @@ export default {
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.tab-style{ .tab-style{
display:flex; /* display:flex;
justify-content: center; justify-content: center;
padding-top:12px; padding-top:12px;
padding-bottom: 8px; padding-bottom: 8px;
align-items: center; align-items: center;
box-shadow:0 2px 3px 0 rgba(220,220,221,0.50); box-shadow:0 2px 3px 0 rgba(220,220,221,0.50);*/
position: relative;
z-index: 50;
background-color: #fff;
display:flex;
justify-content: center;
padding-top:12px;
padding-bottom: 8px;
align-items: center;
box-shadow:0 2px 3px 0 rgba(220,220,221,0.50);
span{ span{
display: block; display: block;
width:112px; width:112px;
......
...@@ -7,24 +7,27 @@ ...@@ -7,24 +7,27 @@
--> -->
<template> <template>
<div class="tab-style"> <div class="tab-style">
<span @click="tabNum = 0;sendTabNum()"><img :src="tabNum == 0?check1:uncheck1"></span> <div :class="{'tab-content-bg':tabNum == 0}" class="tab-content" @click="tabNum = 0;sendTabNum()"><img :src="tabNum == 0?signed:sign"><span
<span @click="tabNum = 1;sendTabNum()"><img :src="tabNum == 1?check2:uncheck2" ></span> :class="{'colored':tabNum == 0}">待签约</span></div>
<!-- <span @click="tabNum = 2;sendTabNum()"><img :src="tabNum == 2?check3:uncheck3"></span> --> <div :class="{'tab-content-bg':tabNum == 1}" class="tab-content" @click="tabNum = 1;sendTabNum()"><img :src="tabNum == 1?finished:finish"><span
:class="{'colored':tabNum == 1}">已签约</span></div>
<!-- <span @click="tabNum = 2;sendTabNum()"><img :src="tabNum == 2?check3:uncheck3"></span> -->
</div> </div>
</template> </template>
<script> <script>
import check1 from '@/assets/distributorSign/unsign.png' import signed from '@/assets/distributorSign/icon-signed.png'
import check2 from '@/assets/intoApproval/check2.png' import finished from '@/assets/distributorSign/icon-finished.png'
import uncheck1 from '@/assets/intoApproval/uncheck1.png' import sign from '@/assets/distributorSign/icon-sign.png'
import uncheck2 from '@/assets/distributorSign/signed.png' import finish from '@/assets/distributorSign/icon-finish.png'
export default { export default {
data () { data () {
return { return {
tabNum: 0, tabNum: 0,
check1: check1, signed: signed,
check2: check2, finished: finished,
uncheck1: uncheck1, sign: sign,
uncheck2: uncheck2, finish: finish,
} }
}, },
methods: { methods: {
...@@ -35,33 +38,54 @@ export default { ...@@ -35,33 +38,54 @@ export default {
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.tab-style{ .tab-style {
position: relative; position: relative;
z-index: 50; z-index: 50;
background-color: #fff; background-color: #fff;
display:flex; display: flex;
// justify-content: center; justify-content: center;
padding-top:12px; padding-top: 12px;
padding-bottom: 8px; padding-bottom: 8px;
align-items: center; align-items: center;
background: #fff; box-shadow: 0 2px 3px 0 rgba(220, 220, 221, 0.50);
box-shadow:0 2px 3px 0 rgba(220,220,221,0.50);
span{ .tab-content {
display: block; display: block;
width:45.9%; width: 45.9%;
height: 32px; height: 32px;
border-radius:16px; background: rgba(220, 220, 221, 0.26);
border-radius: 16px;
display: flex;
justify-content: center;
align-items: center;
span {
margin-left: 2%;
font-size: 14px;
color: #383F45;
font-weight: 600;
font-family: PingFangSC-Semibold;
}
.colored {
color: #00469C
}
} }
span:nth-of-type(1){ .tab-content-bg{
margin-left: 12px background: rgba(0,70,156,0.10);
} }
img{
width:100%; .tab-content:nth-of-type(1) {
height: 32px; margin-left: 12px
// margin-right:5.7px;
} }
span:nth-of-type(2){
margin-left:7px; img {
height: 16px;
// margin-right:5.7px;
} }
}
.tab-content:nth-of-type(2) {
margin-left: 7px;
}
}
</style> </style>
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