Commit 588b69f4 authored by 786817560's avatar 786817560

'bank'

parents 1ad4d0b4 7bd04006
...@@ -2,53 +2,51 @@ ...@@ -2,53 +2,51 @@
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @Author: your name * @Author: your name
* @Date: 2019-09-24 21:29:35 * @Date: 2019-09-24 21:29:35
* @LastEditTime: 2019-09-25 20:08:44 * @LastEditTime: 2019-09-26 17:41:15
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
--> -->
<template> <template>
<div> <div id="bank-card">
<div id="bank-card"> <div class="info">
<div class="info"> <div class="info-icon">
<div class="info-icon"> <img src="@/assets/userBind/info.png" >
<img src="@/assets/userBind/info.png" > <span>温馨提示</span>
<span>温馨提示</span>
</div>
<p>推荐使用农行卡,农行卡支付免收手续费!</p>
</div> </div>
<div class="my-card"> <p>推荐使用农行卡,农行卡支付免收手续费!</p>
<div class="top"> </div>
<div class="left"> <div class="my-card">
<img src="@/assets/userBind/bankIcon.png" class="icon" > <div class="top">
<span class="top-word"> <div class="left">
我的卡 <img src="@/assets/userBind/bankIcon.png" class="icon" >
<span class="sum">(共4张)</span> <span class="top-word">
</span> 我的卡
</div> <span class="sum">(共{{ getBankList.length }}张)</span>
<img src="@/assets/userBind/add.png" class="icon-right" @click="sendFlag" > </span>
</div> </div>
<div class="clear" /> <img src="@/assets/userBind/add.png" class="icon-right" @click="sendFlag" >
<div class="card-content"> </div>
<ul> <div class="clear" />
<li v-for="(item,index) in bankList" :key="index"> <div class="card-content">
<item-option class="slider"> <ul>
<div <li v-for="(item,index) in getBankList" :key="index">
:style="'background-image: url('+ changeBgImg (item) +')'" <item-option class="slider">
class="my-bank-card" <div
> :style="'background-image: url('+ changeBgImg (item) +')'"
<div class="card-info"> class="my-bank-card"
<span class="name">{{ item.bank_full_name }}</span> >
<span class="card-type">{{ item.bank_card_type }}</span> <div class="card-info">
<span class="number">卡号</span> <span class="name">{{ item.bank_full_name }}</span>
<span class="card-number">**** **** **** {{ selectLast (item) }}</span> <span class="card-type">{{ item.bank_card_type }}</span>
</div> <span class="number">卡号</span>
</div> <span class="card-number">**** **** **** {{ selectLast (item) }}</span>
<div slot="buttons" class="button">
<option-button text @click.native="deleteFun(item.bank_account_num)" />
</div> </div>
</item-option> </div>
</li> <div slot="buttons" class="button">
</ul> <option-button text @click.native="deleteFun(item.bank_account_num)" />
</div> </div>
</item-option>
</li>
</ul>
</div> </div>
</div> </div>
</div> </div>
...@@ -58,32 +56,15 @@ import backImg1 from '@/assets/userBind/nong.png' ...@@ -58,32 +56,15 @@ import backImg1 from '@/assets/userBind/nong.png'
import backImg2 from '@/assets/userBind/unNong.png' import backImg2 from '@/assets/userBind/unNong.png'
export default { export default {
props: { props: {
bp_id: { 'getBankList': {
type: String, default: [],
default: '', type: Array,
}, },
}, },
data () { data () {
return { return {
backImg: null, backImg: null,
showModalValue: true, showModalValue: true,
bankList: [
{
bank_account_num: '1231123112311231',
bank_full_name: '中国农业银行',
bank_card_type: '信用卡',
},
{
bank_account_num: '2345763456980965',
bank_full_name: '中国建设银行',
bank_card_type: '储蓄卡',
},
{
bank_account_num: '2345763456980965',
bank_full_name: '中国建设银行',
bank_card_type: '储蓄卡',
},
],
} }
}, },
methods: { methods: {
...@@ -103,24 +84,25 @@ export default { ...@@ -103,24 +84,25 @@ export default {
return num.substring(num.length - 4) return num.substring(num.length - 4)
}, },
deleteFun (e) { deleteFun (e) {
console.log(this.bp_id) let index = this.getBankList.findIndex(item => {
let url = $config.basePath + 'bp_bank_delete' if (item.bank_account_num === e) {
return true
}
})
this.getBankList.splice(index, 1)
let vm = this
let url = process.env.basePath + 'bp_bank_delete'
let param = { let param = {
'master': { 'master': {
'bp_id': this.bp_id, 'bp_id': window.localStorage.user_id,
'bank_account_num': e, 'bank_account_num': e,
}, },
} }
let vm = this vm.hlsPopup.showLoading('请稍候')
this.hlsHttp.post(url, param).then(function (res) { vm.hlsHttp.post(url, param).then(function (res) {
console.log('银行卡删除', res) vm.hlsPopup.hideLoading()
if (res.result === 'S') { if (res.result === 'S') {
let index = vm.bankList.findIndex(item => { console.log(res)
if (item.bank_account_num === e) {
return true
}
})
vm.bankList.splice(index, 1)
} }
}) })
}, },
...@@ -128,138 +110,138 @@ export default { ...@@ -128,138 +110,138 @@ export default {
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
#bank-card { #bank-card {
.info { .info {
height: 70px; height: 70px;
background-color: rgba(142, 195, 30, 0.1); background-color: rgba(142, 195, 30, 0.1);
.info-icon { .info-icon {
height: 20px;
padding-top: 20px;
display: flex;
align-items: center;
img {
width: 15.8px;
height: 15.8px;
margin-left: 17.1px;
}
span {
font-family: PingFangSC-Semibold;
font-size: 14px;
color: #8ec31e;
margin-left: 9px;
letter-spacing: 0.5px;
line-height: 20px;
}
}
p {
font-family: PingFangSC-Regular;
font-size: 13px;
color: #656464;
width: 310px;
margin-left: 42px;
letter-spacing: 0.4px;
line-height: 18px;
margin-top: 8px;
}
}
.my-card {
.top {
width: 320px;
margin: 0 auto;
margin-top: 13px;
.left {
height: 32px;
display: flex;
align-items: center;
float: left;
.icon {
width: 18px;
height: 20px; height: 20px;
margin-right: 4px; padding-top: 20px;
} display: flex;
.top-word { align-items: center;
font-family: PingFangSC-Semibold; img {
font-size: 15px; width: 15.8px;
color: #00469c; height: 15.8px;
letter-spacing: 0.46px; margin-left: 17.1px;
.sum { }
span {
font-family: PingFangSC-Semibold; font-family: PingFangSC-Semibold;
font-size: 15px; font-size: 14px;
color: #4d5d6c; color: #8ec31e;
letter-spacing: 0.46px; margin-left: 9px;
letter-spacing: 0.5px;
line-height: 20px;
} }
} }
} p {
.icon-right { font-family: PingFangSC-Regular;
width: 34px; font-size: 13px;
height: 34px; color: #656464;
float: right; width: 310px;
} margin-left: 42px;
} letter-spacing: 0.4px;
.clear { line-height: 18px;
clear: both; margin-top: 8px;
}
.card-content {
width: 350px;
padding-left: 28px;
overflow: hidden;
margin-top: 16px;
li {
margin-bottom: 10px;
.slider {
height: 100%;
margin-left: -14px;
} }
} }
.my-bank-card { .my-card {
width: 320px; .top {
height: 190px; width: 320px;
box-shadow: 0 5px 20px 0 rgba(101, 101, 101, 0.25); margin: 0 auto;
border-radius: 6px; margin-top: 13px;
background-size: 320px 190px; .left {
.card-info { height: 32px;
font-family: PingFangSC-Medium; display: flex;
color: #ffffff; align-items: center;
margin-left: 18px; float: left;
padding-top: 15px; .icon {
.name, width: 18px;
.card-type { height: 20px;
font-size: 16px; margin-right: 4px;
letter-spacing: 5.5px; }
line-height: 24px; .top-word {
font-family: PingFangSC-Semibold;
font-size: 15px;
color: #00469c;
letter-spacing: 0.46px;
.sum {
font-family: PingFangSC-Semibold;
font-size: 15px;
color: #4d5d6c;
letter-spacing: 0.46px;
}
}
} }
.card-type { .icon-right {
display: block; width: 34px;
margin-top: 9px; height: 34px;
float: right;
} }
.number { }
font-size: 12px; .clear {
letter-spacing: 0; clear: both;
line-height: 16px; }
margin-top: 33px; .card-content {
display: block; width: 350px;
margin-top: 33px; padding-left: 28px;
overflow: hidden;
margin-top: 16px;
li {
margin-bottom: 10px;
.slider {
height: 100%;
margin-left: -14px;
}
} }
.card-number { .my-bank-card {
display: block; width: 320px;
font-family: Avenir-Heavy; height: 190px;
font-size: 16px; box-shadow: 0 5px 20px 0 rgba(101, 101, 101, 0.25);
color: #ffffff; border-radius: 6px;
letter-spacing: 6px; background-size: 320px 190px;
line-height: 24px; .card-info {
font-family: PingFangSC-Medium;
color: #ffffff;
margin-left: 18px;
padding-top: 15px;
.name,
.card-type {
font-size: 16px;
letter-spacing: 5.5px;
line-height: 24px;
}
.card-type {
display: block;
margin-top: 9px;
}
.number {
font-size: 12px;
letter-spacing: 0;
line-height: 16px;
margin-top: 33px;
display: block;
margin-top: 33px;
}
.card-number {
display: block;
font-family: Avenir-Heavy;
font-size: 16px;
color: #ffffff;
letter-spacing: 6px;
line-height: 24px;
}
}
} }
} }
} }
.swipeout-list .item .function {
left: 330px;
border-radius: 6px;
width: 54px;
height: 190px;
background: url("../../../assets/userBind/delete.png") 16px 84.9px #fde5e8
no-repeat;
background-size: 20px 20px;
}
} }
}
.swipeout-list .item .function {
left: 330px;
border-radius: 6px;
width: 54px;
height: 190px;
background: url("../../../assets/userBind/delete.png") 16px 84.9px #fde5e8
no-repeat;
background-size: 20px 20px;
}
}
</style> </style>
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @Author: your name * @Author: your name
* @Date: 2019-09-19 09:31:19 * @Date: 2019-09-19 09:31:19
* @LastEditTime: 2019-09-26 14:00:48 * @LastEditTime: 2019-09-26 17:28:42
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
--> -->
<template> <template>
...@@ -491,6 +491,8 @@ export default { ...@@ -491,6 +491,8 @@ export default {
if (res.result === 'S') { if (res.result === 'S') {
vm.hlsPopup.hideLoading() vm.hlsPopup.hideLoading()
vm.hlsPopup.showSuccess('保存成功') vm.hlsPopup.showSuccess('保存成功')
window.localStorage.setItem('user_id', res.bp_id)
window.sessionStorage.setItem('user_id', res.bp_id)
vm.bp_id = res.bp_id vm.bp_id = res.bp_id
} }
}) })
......
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