btn-status

@@ -33,4 +33,6 @@
         </div>
     </div>
     {{/usable_giftCards}}
+
+    <button id="useGiftCardBtn" class="use-giftcard-btn">使用</button>
 </div>
\ No newline at end of file

@@ -11,8 +11,8 @@ const isProduction = process.env.NODE_ENV === 'production';
 const isTest = process.env.NODE_ENV === 'test';
 
 const domains = {
-    api: 'http://api-test3.yohops.com:9999/',
-    service: 'http://service-test3.yohops.com:9999/',
+    api: 'http://dev-api.yohops.com:9999/',
+    service: 'http://dev-service.yohops.com:9999/',
     singleApi: 'http://api-test3.yohops.com:9999/',
     global: 'http://global-test-soa.yohops.com:9999',
     liveApi: 'http://testapi.live.yohops.com:9999/',

@@ -10,7 +10,8 @@ class SelectGiftCard extends Page {
         this.selector = {
             rule: $('#rule'),
             page: $('.select-giftcard-page'),
-            giftcard: $('.giftcard')
+            giftcard: $('.giftcard'),
+            useGiftCardBtn: $('#useGiftCardBtn')
         };
         this.init();
         this.bindEvents();
@@ -24,6 +25,25 @@ class SelectGiftCard extends Page {
 
     bindEvents() {
         this.selector.giftcard.on('click', '.checkbox', this.checkboxClickHandle.bind(this));
+        this.selector.useGiftCardBtn.on('click', this.useGiftCard.bind(this));
+    }
+
+    /**
+     * 使用礼品卡
+     */
+    useGiftCard() {
+        console.log('ok');
+    }
+
+    /**
+     * 改变 使用 按钮状态
+     */
+    changeUseBtnStatus() {
+        if (this.selector.giftcard.hasClass('checked')) {
+            this.selector.useGiftCardBtn.addClass('active');
+        } else {
+            this.selector.useGiftCardBtn.removeClass('active');
+        }
     }
 
     /**
@@ -37,6 +57,8 @@ class SelectGiftCard extends Page {
         } else {
             theGiftCard.addClass('checked');
         }
+
+        this.changeUseBtnStatus();
     }
 }
 

@@ -16,6 +16,10 @@ $title-font-color: #fff;
         display: none;
     }
 
+    .active {
+        background-color: #444 !important;
+    }
+
     .pull-left {
         float: left;
     }
@@ -106,4 +110,17 @@ $title-font-color: #fff;
     .checked > .card-body > .checkbox > .no-checked-icon {
         display: none;
     }
+
+    .use-giftcard-btn {
+        position: fixed;
+        bottom: 0;
+        left: 0;
+        width: 750px;
+        height: 88px;
+        border-radius: 2px;
+        background-color: #b0b0b0;
+        color: #fff;
+        font-size: 32px;
+        text-align: center;
+    }
 }