分期3

@@ -606,10 +606,50 @@ const bankCard = (req, res) => {
 
 // 银行卡详情
 const cardDetail = (req, res) => {
-    res.render('installment/card-detail', {
-        title: '银行卡详情',
-        isInstallmentPage: true,
-        width750: true
+
+    installmentModel.getCardDetail(req.cookies.installmentUid, req.query.cardIdNo).then(result => {
+        res.render('installment/card-detail', {
+            module: 'home',
+            page: 'card-detail',
+            title: '银行卡详情',
+            isInstallmentPage: true,
+            width750: true,
+            cardDetail: result
+        });
+    });
+};
+
+// 删除绑定
+const delBankCard = (req, res) => {
+    let params = {
+        uid: req.cookies.installmentUid,
+        cardIdNo: req.query.cardIdNo
+    };
+
+    installmentModel.delBankCard(params).then((result) => {
+        res.json(result);
+    }).catch(() => {
+        _serverCrash(res, {
+            url: req.originalUrl,
+            title: '银行卡详情'
+        });
+    });
+};
+
+// 切换银行卡绑定
+const setMasterCard = (req, res) => {
+    let params = {
+        uid: req.cookies.installmentUid,
+        cardIdNo: req.query.cardIdNo
+    };
+
+    installmentModel.setMasterCard(params).then((result) => {
+        res.json(result);
+    }).catch(() => {
+        _serverCrash(res, {
+            url: req.originalUrl,
+            title: '银行卡详情'
+        });
     });
 };
 
@@ -640,5 +680,7 @@ module.exports = {
     serverCrash,
     bankCard,
     postAccount,
-    cardDetail
+    cardDetail,
+    delBankCard,
+    setMasterCard
 };

@@ -169,6 +169,21 @@ const _processBankCards = (list) => {
     return list;
 };
 
+// 银行卡详情数据处理
+const _processCardDetail = (list, cardIdNo) => {
+    list = list || [];
+
+    _.forEach(list, (item) => {
+        if (item.cardIdNo === cardIdNo) {
+            item.isMaster = item.masterType || 1;
+
+            return item;
+        } else {
+            return {};
+        }
+    });
+};
+
 /**
  * 获取资源位数据
  * @return {[array]}
@@ -481,6 +496,41 @@ const postAccount = (params) => {
     });
 };
 
+// 获取银行卡详情
+const getCardDetail = (uid, cardIdNo) => {
+    return api.get('', {
+        method: 'user.instalment.getBankCards',
+        uid: uid
+    }, {
+        timeout: API_TIMEOUT
+    }).then((result) => {
+        if (result && result.code === 200) {
+            return _processCardDetail(result.data, cardIdNo);
+        } else {
+            logger.error('get getBankCards data return code is not 200');
+            return '';
+        }
+    });
+};
+
+// 解除银行卡绑定
+const delBankCard = (params) => {
+    return api.get('', _.assign({
+        method: 'user.instalment.unbindCard'
+    }, params)).then((res) => {
+        return res;
+    });
+};
+
+// 切换银行卡主卡
+const setMasterCard = (params) => {
+    return api.get('', _.assign({
+        method: 'user.instalment.toggleCard'
+    }, params)).then((res) => {
+        return res;
+    });
+};
+
 module.exports = {
     getStauts,
     getQueryCreditInfo,
@@ -497,5 +547,8 @@ module.exports = {
     getInstallmentOrderDetail,
     totalAmount,
     checkVerifyCode,
-    postAccount
+    postAccount,
+    getCardDetail,
+    delBankCard,
+    setMasterCard
 };

@@ -132,6 +132,8 @@ router.get('/installment/agreement', installment.agreement);// æœåŠ¡åè®®é™æ€
 router.get('/installment/server-crash', installment.serverCrash); // 服务器崩溃
 router.get('/installment/bank-card', installment.bankCard); // 银行卡列表
 router.get('/installment/card-detail', installment.cardDetail); // 银行卡详情
+router.get('/installment/delBankCard', installment.delBankCard); // 删除绑定
+router.get('/installment/setMasterCard', installment.setMasterCard); // 切换主卡
 
 router.get('/recommend-for-you/userCenter', recommendForYou.userCenter);// 为你优选
 

 <div class="card-detail-page yoho-page">
-    <div class="card-detail">
-        <div class="card-icon-abc"></div>
-        <div class="card-right">
-            <p class="bank-name">{{bankName}}</p>
-            <p class="card-no">储蓄卡 | 尾号{{cardNo}}</p>
+    {{#cardDetail}}
+        <div class="card-detail" data-card-id="{{cardIdNo}}">
+            <div class="card-icon card-icon-{{lowerCase bankCode}}"></div>
+            <div class="card-right">
+                <p class="bank-name">{{bankName}}</p>
+                <p class="card-no">储蓄卡 | 尾号{{cardNo}}</p>
+            </div>
         </div>
-    </div>
+        <ul class="card-info">
+            <li><span class="txt-label">持卡人</span><span class="info-right card-user">{{userName}}</span></li>
+            <li><span class="txt-label">预留手机号</span><span class="info-right card-mobile">{{mobile}}</span></li>
+            <li>
+                <span class="txt-label">分期银行</span>
+                <span class="info-right card-bank">
+                    {{#if isMaster}}
+                        主卡，用于支付验证和还款验证。
+                    {{else}}
+                        副卡，仅用于还款验证。
+                    {{/if}}
+                </span>
+            </li>
+        </ul>
+        <div class="tip-cont">
+            {{#if isMaster}}
+                <p>如果您更换银行预留手机号，请先新增其他还款银行卡，并将新增银行卡切换为主卡，并解除绑定此卡，再次重新绑定即可。</p>
+            {{else}}
+                <p>如果您更换银行预留手机号，请先将银行卡解除绑定，再次重新绑定即可。</p>
+
+                <div class="card-btn">
+                    <span class="relieve-btn">解除绑定</span>
+                    <span class="change-btn">切换为主卡</span>
+                </div>
+            {{/if}}
+        </div>
+    {{/cardDetail}}
 </div>

@@ -22,10 +22,10 @@ module.exports = {
         // liveApi: 'http://api.live.yoho.cn/',
         // singleApi: 'http://single.yoho.cn/'
 
-        api: 'http://api-test1.yohops.com:9999/',
-        service: 'http://service-test1.yohops.com:9999/',
+        api: 'http://api-test3.yohops.com:9999/',
+        service: 'http://service-test3.yohops.com:9999/',
         liveApi: 'http://testapi.live.yohops.com:9999/',
-        singleApi: 'http://api-test1.yohops.com:9999/'
+        singleApi: 'http://api-test3.yohops.com:9999/'
 
         // api: 'http://api.yoho.yohoops.org/',
         // service: 'http://service.yoho.yohoops.org/',

+/**
+ * 银行卡详情
+ * @author: wsl<shuiling.wang@yoho.cn>
+ * @date: 2016/10/25
+ */
+
+var $ = require('yoho-jquery');
+var tip = require('../plugin/tip');
+var dialog = require('../plugin/dialog');
+var cardDetail = {
+    init: function() {
+        var self = this,
+            $relieveBtn = $('.relieve-btn'),
+            $changeBtn = $('.change-btn');
+
+        self.cardIdNo = $('.card-detail').data('cardId');
+
+        if (window.queryString.setMaster) {
+            tip.show('切换成功!');
+        }
+
+        $relieveBtn.on('click', function() {
+            self.dialogAction({
+                text: '你确定要解除绑定此卡吗？解除绑定后该银行卡将不出现在还款银行卡列表中。',
+                url: '/home/installment/delBankCard',
+                errorText: '解除失败',
+                successAction: function() {
+                    tip.show('解除成功!');
+                    window.location.href = '/home/installment/bank-card';
+                }
+            });
+        });
+
+        $changeBtn.on('click', function() {
+            self.dialogAction({
+                text: '你确定要设置该银行卡为主卡吗？确定设置后原主卡将自动修改为副卡。',
+                url: '/home/installment/setMasterCard',
+                errorText: '切换失败',
+                successAction: function() {
+                    window.location.href = '/home/installment/card-detail?setMaster=true';
+                }
+            });
+        });
+    },
+    dialogAction: function(params) {
+        var self = this;
+        
+        dialog.showDialog({
+            dialogText: params.text,
+            hasFooter: {
+                leftBtnText: '取消',
+                rightBtnText: '确定'
+            }
+        }, function() {
+            $.ajax({
+                type: 'GET',
+                url: params.url,
+                data: {
+                    cardIdNo: self.cardIdNo
+                },
+                success: function(data) {
+                    dialog.hideDialog();
+                    if (data.code === 200) {
+                        params.successAction();
+                    } else {
+                        tip.show(params.errorText);
+                    }
+                    self.flag = false;
+                },
+                error: function() {
+                    tip.show(params.errorText);
+                    self.flag = false;
+                }
+            });
+        });
+    }
+};
+
+require('../common');
+
+$(function() {
+    cardDetail.init();
+});

 .card-detail-page {
     .card-detail {
+        font-family: "黑体";
         width: 100%;
         height: 120px;
         background: #ff575c;
         color: #fff;
     }
+
+    .card-icon {
+        width: 80px;
+        height: 80px;
+        float: left;
+        margin: 20px 0 0 30px;
+    }
+
+    .card-icon-abc {
+        background: url("/home/bank-icons/b-ABC.png") no-repeat;
+    }
+
+    .card-icon-boc {
+        background: url("/home/bank-icons/b-BOC.png") no-repeat;
+    }
+
+    .card-icon-ccb {
+        background: url("/home/bank-icons/b-CCB.png") no-repeat;
+    }
+
+    .card-icon-ceb {
+        background: url("/home/bank-icons/b-CEB.png") no-repeat;
+    }
+
+    .card-icon-cgb {
+        background: url("/home/bank-icons/b-CGB.png") no-repeat;
+    }
+
+    .card-icon-cib {
+        background: url("/home/bank-icons/b-CIB.png") no-repeat;
+    }
+
+    .card-icon-citic {
+        background: url("/home/bank-icons/b-CITIC.png") no-repeat;
+    }
+
+    .card-icon-cmbc {
+        background: url("/home/bank-icons/b-CMBC.png") no-repeat;
+    }
+
+    .card-icon-icbc {
+        background: url("/home/bank-icons/b-ICBC.png") no-repeat;
+    }
+
+    .card-icon-payh {
+        background: url("/home/bank-icons/b-PAYH.png") no-repeat;
+    }
+
+    .card-icon-psbc {
+        background: url("/home/bank-icons/b-PSBC.png") no-repeat;
+    }
+
+    .card-right {
+        float: left;
+        margin-left: 10px;
+
+        .bank-name {
+            font-size: 30px;
+            margin-top: 20px;
+        }
+
+        .card-no {
+            font-size: 26px;
+            font-style: normal;
+        }
+    }
+
+    .card-info {
+        background: #fff;
+        border-bottom: 1px solid #e0e0e0;
+        width: 100%;
+        height: auto;
+        overflow: hidden;
+        padding-left: 30px;
+        box-sizing: border-box;
+
+        li {
+            height: 88px;
+            border-bottom: 1px solid #e0e0e0;
+            line-height: 88px;
+
+            .txt-label {
+                width: 220px;
+                text-align: left;
+                font-size: 34px;
+                color: #444;
+                float: left;
+            }
+
+            .info-right {
+                float: left;
+                color: #444;
+                font-size: 28px;
+            }
+        }
+
+        li:last-child {
+            border-bottom: none;
+        }
+    }
+
+    .tip-cont {
+        p {
+            color: #b0b0b0;
+            font-size: 22px;
+            line-height: 30px;
+            padding: 25px 25px 0;
+        }
+
+        .card-btn {
+            width: 656px;
+            margin: 94px auto 0;
+            font-size: 28px;
+            line-height: 88px;
+        }
+
+        span {
+            float: left;
+            width: 312px;
+            height: 88px;
+            border-radius: 10px;
+            text-align: center;
+            cursor: pointer;
+        }
+
+        .relieve-btn {
+            background: #fff;
+            border: 1px solid #444;
+            color: #444;
+            margin-right: 30px;
+        }
+
+        .change-btn {
+            background: #444;
+            color: #fff;
+        }
+    }
 }