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

Merge branch 'develop' of https://hel.hand-china.com/xugong/hls-xcmg-vue-app into develop

parents 0437f37a 28540829
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
</item> </item>
<item> <item>
<div slot="name">经销商</div> <div slot="name">经销商</div>
<div slot="content">{{ detailInfo.bp_agent_name }}代理商</div> <div slot="content">{{ detailInfo.bp_agent_name }}</div>
</item> </item>
<item> <item>
<div slot="name">承租人</div> <div slot="name">承租人</div>
......
...@@ -16,67 +16,68 @@ ...@@ -16,67 +16,68 @@
<img src="@/assets/payment/back.png" @click="show=false" > <img src="@/assets/payment/back.png" @click="show=false" >
<span>支付方式</span> <span>支付方式</span>
</div> </div>
<list-item :item-height="56" class="pay-way"> <scroll>
<item <list-item :item-height="56" class="pay-way">
v-for="(item,index) in nongBank" <item
:proportion="[7,1,1]" v-for="(item,index) in nongBank"
:key="item.bank_account_num" :proportion="[7,1,1]"
@click.native="isSelect(`nong${index}`);ischeck(item)" :key="item.bank_account_num"
> @click.native="isSelect(`nong${index}`);ischeck(item)"
<div slot="name" style="flex=3"> >
<img :src="selectImg(item)" alt class="icon" > <div slot="name" style="flex=3">
{{ item.bank_full_name }}({{ selectLast(item) }}) <img :src="selectImg(item)" alt class="icon" >
<img {{ item.bank_full_name }}({{ selectLast(item) }})
v-show="item.recommand" <img
class="push" v-show="item.recommand"
src="@/assets/payment/push.png" class="push"
> src="@/assets/payment/push.png"
</div> >
<section slot="content"> </div>
<img v-show="select === `nong${index}`" src="@/assets/payment/select.png" alt > <section slot="content">
<img v-show="select !== `nong${index}`" src="@/assets/payment/unselect.png" alt > <img v-show="select === `nong${index}`" src="@/assets/payment/select.png" alt >
</section> <img v-show="select !== `nong${index}`" src="@/assets/payment/unselect.png" alt >
</item> </section>
<item :proportion="[7,1,1]" @click.native="isSelect('one');ischeck('one')"> </item>
<div slot="name"> <item :proportion="[7,1,1]" @click.native="isSelect('one');ischeck('one')">
<img src="@/assets/payment/alipay.png" alt class="icon1" > 支付宝 <div slot="name">
</div> <img src="@/assets/payment/alipay.png" alt class="icon1" > 支付宝
<section slot="content"> </div>
<img v-show="select === 'one'" src="@/assets/payment/select.png" alt > <section slot="content">
<img v-show="select !== 'one'" src="@/assets/payment/unselect.png" alt > <img v-show="select === 'one'" src="@/assets/payment/select.png" alt >
</section> <img v-show="select !== 'one'" src="@/assets/payment/unselect.png" alt >
</item> </section>
<item :proportion="[7,1,1]" @click.native="isSelect('two');ischeck('two')"> </item>
<div slot="name"> <item :proportion="[7,1,1]" @click.native="isSelect('two');ischeck('two')">
<img src="@/assets/payment/wx.png" alt class="icon2" > 微信 <div slot="name">
</div> <img src="@/assets/payment/wx.png" alt class="icon2" > 微信
<section slot="content"> </div>
<img v-show="select === 'two'" src="@/assets/payment/select.png" alt > <section slot="content">
<img v-show="select !== 'two'" src="@/assets/payment/unselect.png" alt > <img v-show="select === 'two'" src="@/assets/payment/select.png" alt >
</section> <img v-show="select !== 'two'" src="@/assets/payment/unselect.png" alt >
</item> </section>
<item </item>
v-for="(item,index) in newList" <item
:proportion="[7,1,1]" v-for="(item,index) in newList"
:key="index" :proportion="[7,1,1]"
@click.native="isSelect(`three${index}`);ischeck(item)" :key="index"
> @click.native="isSelect(`three${index}`);ischeck(item)"
<div slot="name" style="flex=3"> >
<img :src="selectImg(item)" alt class="icon" > <div slot="name" style="flex=3">
{{ item.bank_full_name }}({{ selectLast(item) }}) <img :src="selectImg(item)" alt class="icon" >
<img {{ item.bank_full_name }}({{ selectLast(item) }})
v-show="item.recommand" <img
class="push" v-show="item.recommand"
src="@/assets/payment/push.png" class="push"
> src="@/assets/payment/push.png"
</div> >
<section slot="content"> </div>
<img v-show="select === `three${index}`" src="@/assets/payment/select.png" alt > <section slot="content">
<img v-show="select !== `three${index}`" src="@/assets/payment/unselect.png" alt > <img v-show="select === `three${index}`" src="@/assets/payment/select.png" alt >
</section> <img v-show="select !== `three${index}`" src="@/assets/payment/unselect.png" alt >
</item> </section>
</list-item> </item>
</div> </list-item>
</scroll></div>
</div> </div>
</transition> </transition>
<transition name="trans"> <transition name="trans">
...@@ -131,10 +132,10 @@ ...@@ -131,10 +132,10 @@
<span>¥{{ parseFloat(money).toFixed(2) |currency }}</span> <span>¥{{ parseFloat(money).toFixed(2) |currency }}</span>
</div> </div>
<div class="interest"> <div class="interest">
<span>本次交易收取{{ rate }}%服务</span> <span>本次交易收取{{ rate }}%手续</span>
</div> </div>
<div class="info-item"> <div class="info-item">
<span>服务</span> <span>手续</span>
<span>{{ serviceCharge }}</span> <span>{{ serviceCharge }}</span>
</div> </div>
<div class="info-item" @click="show=true"> <div class="info-item" @click="show=true">
...@@ -354,6 +355,9 @@ export default { ...@@ -354,6 +355,9 @@ export default {
</script> </script>
<style lang='less' > <style lang='less' >
#pay-entry { #pay-entry {
.vue-better-scroll__wrapper{
padding: 0;
}
.trans-enter-active, .trans-enter-active,
.trans-leave-active { .trans-leave-active {
transition: opacity 0.5s; transition: opacity 0.5s;
...@@ -375,17 +379,17 @@ export default { ...@@ -375,17 +379,17 @@ export default {
height: 466px; height: 466px;
width: 100%; width: 100%;
position: relative; position: relative;
bottom: -18%; top:16%;
background-color: #fff; background-color: #fff;
border-radius: 12px 12px 0 0; border-radius: 12px 12px 0 0;
overflow: scroll; overflow: scroll;
display: flex;
align-items: center;
flex-direction: column;
.top { .top {
position: fixed;
padding-left:24px;
width: 330px; width: 330px;
height: 54px; height: 54px;
display: flex; display: flex;
z-index: 900;
align-items: center; align-items: center;
background-color: #fff; background-color: #fff;
img { img {
...@@ -400,70 +404,7 @@ export default { ...@@ -400,70 +404,7 @@ export default {
text-align: center; text-align: center;
} }
} }
.info {
width: 100%;
height: 226px;
background-color: #fff;
margin-top:65px;
.info-item {
height: 46px;
width: 335px;
margin: 0 auto;
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
.arrow {
margin-right: -10px;
}
img {
width: 17px;
margin-right: 10px;
}
span:first-child {
font-family: PingFangSC-Regular;
font-size: 14px;
color: rgba(56, 63, 69, 0.6);
letter-spacing: 0;
line-height: 18px;
}
span:last-child {
font-family: Verdana;
font-size: 14px;
color: #383f45;
letter-spacing: 0;
line-height: 18px;
display: flex;
align-items: center;
}
}
.info-item:nth-of-type(1)::after {
content: "";
display: block;
position: absolute;
right: 20px;
top: 25px;
border: 10px solid #fff;
border-left-color: transparent;
border-right-color: transparent;
border-top-color: transparent;
border-bottom-color: rgba(75, 74, 75, 0.1);
}
.info-item:nth-of-type(1) {
border-top: 1px solid #d9dbdf;
}
.interest {
width: 100%;
height: 37px;
line-height: 37px;
font-family: PingFangSC-Medium;
font-size: 11px;
color: #4b4a4b;
letter-spacing: 0;
text-indent: 215px;
background-color: rgba(75, 74, 75, 0.1);
}
}
} }
} }
.modal-show-bank { .modal-show-bank {
...@@ -479,13 +420,14 @@ export default { ...@@ -479,13 +420,14 @@ export default {
height: 466px; height: 466px;
width: 100%; width: 100%;
position: relative; position: relative;
bottom: -18%; top:16%;
background-color: #fff; background-color: #fff;
border-radius: 12px 12px 0 0; border-radius: 12px 12px 0 0;
overflow: scroll; overflow: scroll;
display: flex;
align-items: center;
flex-direction: column;
.top { .top {
position: fixed;
padding-left: 24px;
width: 330px; width: 330px;
height: 54px; height: 54px;
display: flex; display: flex;
...@@ -505,10 +447,10 @@ export default { ...@@ -505,10 +447,10 @@ export default {
} }
} }
.pay-way { .pay-way {
width: 350px;
margin: 0 auto; width: 100%;
margin-top: 54px; padding: 0 4% 0 4%;
background-color: #fff; background: #fff;
.hls-item { .hls-item {
padding-left: 12px; padding-left: 12px;
.add-name { .add-name {
...@@ -517,7 +459,11 @@ export default { ...@@ -517,7 +459,11 @@ export default {
font-family: PingFangSC-Regular; font-family: PingFangSC-Regular;
font-size: 14px; font-size: 14px;
color: #656464; color: #656464;
div{
display: flex;
justify-content: center;
align-items: center;
}
.icon1 { .icon1 {
width: 34px; width: 34px;
height: 34px; height: 34px;
...@@ -538,7 +484,7 @@ export default { ...@@ -538,7 +484,7 @@ export default {
display: block; display: block;
float: left; float: left;
position: relative; position: relative;
margin: 12px 8px 0 3px; margin: 0 8px 0 3px;
} }
} }
...@@ -551,7 +497,79 @@ export default { ...@@ -551,7 +497,79 @@ export default {
} }
} }
} }
.info {
width: 100%;
height: 226px;
background-color: #fff;
.info-item {
height: 46px;
width: 335px;
margin: 0 auto;
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
.arrow {
margin-right: -10px;
}
img {
width: 17px;
margin-right: 10px;
}
span:first-child {
font-family: PingFangSC-Regular;
font-size: 14px;
color: rgba(56, 63, 69, 0.6);
letter-spacing: 0;
line-height: 18px;
}
span:last-child {
font-family: Verdana;
font-size: 14px;
color: #383f45;
letter-spacing: 0;
line-height: 18px;
display: flex;
align-items: center;
}
}
.info-item:nth-of-type(1)::after {
content: "";
display: block;
position: absolute;
right: 20px;
top: 25px;
border: 10px solid #fff;
border-left-color: transparent;
border-right-color: transparent;
border-top-color: transparent;
border-bottom-color: rgba(75, 74, 75, 0.1);
}
.info-item:nth-of-type(1) {
border-top: 1px solid #d9dbdf;
}
.interest {
width: 100%;
height: 37px;
line-height: 37px;
font-family: PingFangSC-Medium;
font-size: 11px;
color: #4b4a4b;
letter-spacing: 0;
text-indent: 215px;
background-color: rgba(75, 74, 75, 0.1);
}
}
.icon {
width: 30px;
display: block;
float: left;
position: relative;
margin: 12px 8px 0 3px;
}
.push {
width: 35px;
}
.modal-show { .modal-show {
width: 100%; width: 100%;
height: 100%; height: 100%;
...@@ -600,12 +618,6 @@ export default { ...@@ -600,12 +618,6 @@ export default {
} }
} }
} }
.push {
margin-left: 0.2rem;
width: 0.7rem;
float: right;
margin-top: 11px;
}
.entry-content { .entry-content {
.amount { .amount {
......
...@@ -18,65 +18,65 @@ ...@@ -18,65 +18,65 @@
</div> </div>
<scroll> <scroll>
<list-item :item-height="56" class="pay-way"> <list-item :item-height="56" class="pay-way">
<item <item
v-for="(item,index) in nongBank" v-for="(item,index) in nongBank"
:proportion="[7,1,1]" :proportion="[7,1,1]"
:key="item.bank_account_num" :key="item.bank_account_num"
@click.native="isSelect(`nong${index}`);ischeck(item)" @click.native="isSelect(`nong${index}`);ischeck(item)"
> >
<div slot="name" style="flex=3"> <div slot="name" style="flex=3">
<img :src="selectImg(item)" alt class="icon" > <img :src="selectImg(item)" alt class="icon" >
{{ item.bank_full_name }}({{ selectLast(item) }}) {{ item.bank_full_name }}({{ selectLast(item) }})
<img <img
v-show="item.recommand" v-show="item.recommand"
class="push" class="push"
src="@/assets/payment/push.png" src="@/assets/payment/push.png"
> >
</div> </div>
<section slot="content"> <section slot="content">
<img v-show="select === `nong${index}`" src="@/assets/payment/select.png" alt > <img v-show="select === `nong${index}`" src="@/assets/payment/select.png" alt >
<img v-show="select !== `nong${index}`" src="@/assets/payment/unselect.png" alt > <img v-show="select !== `nong${index}`" src="@/assets/payment/unselect.png" alt >
</section> </section>
</item> </item>
<item :proportion="[7,1,1]" @click.native="isSelect('one');ischeck('one')"> <item :proportion="[7,1,1]" @click.native="isSelect('one');ischeck('one')">
<div slot="name"> <div slot="name">
<img src="@/assets/payment/alipay.png" alt class="icon1" > 支付宝 <img src="@/assets/payment/alipay.png" alt class="icon1" > 支付宝
</div> </div>
<section slot="content"> <section slot="content">
<img v-show="select === 'one'" src="@/assets/payment/select.png" alt > <img v-show="select === 'one'" src="@/assets/payment/select.png" alt >
<img v-show="select !== 'one'" src="@/assets/payment/unselect.png" alt > <img v-show="select !== 'one'" src="@/assets/payment/unselect.png" alt >
</section> </section>
</item> </item>
<item :proportion="[7,1,1]" @click.native="isSelect('two');ischeck('two')"> <item :proportion="[7,1,1]" @click.native="isSelect('two');ischeck('two')">
<div slot="name"> <div slot="name">
<img src="@/assets/payment/wx.png" alt class="icon2" > 微信 <img src="@/assets/payment/wx.png" alt class="icon2" > 微信
</div> </div>
<section slot="content"> <section slot="content">
<img v-show="select === 'two'" src="@/assets/payment/select.png" alt > <img v-show="select === 'two'" src="@/assets/payment/select.png" alt >
<img v-show="select !== 'two'" src="@/assets/payment/unselect.png" alt > <img v-show="select !== 'two'" src="@/assets/payment/unselect.png" alt >
</section> </section>
</item> </item>
<item <item
v-for="(item,index) in newList" v-for="(item,index) in newList"
:proportion="[7,1,1]" :proportion="[7,1,1]"
:key="index" :key="index"
@click.native="isSelect(`three${index}`);ischeck(item)" @click.native="isSelect(`three${index}`);ischeck(item)"
> >
<div slot="name" style="flex=3"> <div slot="name" style="flex=3">
<img :src="selectImg(item)" alt class="icon" > <img :src="selectImg(item)" alt class="icon" >
{{ item.bank_full_name }}({{ selectLast(item) }}) {{ item.bank_full_name }}({{ selectLast(item) }})
<img <img
v-show="item.recommand" v-show="item.recommand"
class="push" class="push"
src="@/assets/payment/push.png" src="@/assets/payment/push.png"
> >
</div> </div>
<section slot="content"> <section slot="content">
<img v-show="select === `three${index}`" src="@/assets/payment/select.png" alt > <img v-show="select === `three${index}`" src="@/assets/payment/select.png" alt >
<img v-show="select !== `three${index}`" src="@/assets/payment/unselect.png" alt > <img v-show="select !== `three${index}`" src="@/assets/payment/unselect.png" alt >
</section> </section>
</item> </item>
</list-item> </list-item>
</scroll> </scroll>
</div> </div>
</div></transition> </div></transition>
...@@ -133,10 +133,10 @@ ...@@ -133,10 +133,10 @@
<span>¥{{ parseFloat(money).toFixed(2) |currency }}</span> <span>¥{{ parseFloat(money).toFixed(2) |currency }}</span>
</div> </div>
<div class="interest"> <div class="interest">
<span>本次交易收取{{ rate }}%服务</span> <span>本次交易收取{{ rate }}%手续</span>
</div> </div>
<div class="info-item"> <div class="info-item">
<span>服务</span> <span>手续</span>
<span>{{ serviceCharge }}</span> <span>{{ serviceCharge }}</span>
</div> </div>
<div class="info-item" @click="show=true"> <div class="info-item" @click="show=true">
...@@ -393,7 +393,6 @@ export default { ...@@ -393,7 +393,6 @@ export default {
align-items: center; align-items: center;
flex-direction: column; flex-direction: column;
.top { .top {
padding-left: 24px;
width: 330px; width: 330px;
height: 54px; height: 54px;
display: flex; display: flex;
......
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