From 498cf7bc6d57c86d7a065fda712e460fb3aa3cae Mon Sep 17 00:00:00 2001
From: 郭成尧 <chengyao.guo@yoho.cn>
Date: Mon, 2 Apr 2018 10:56:34 +0800
Subject: [PATCH] page-base-ok
---
apps/cart/controllers/order.js | 3 ++-
apps/cart/views/action/select-coupons.hbs | 35 +++++++++++++++++++++++++++++++++++
public/scss/cart/select-coupons.page.css | 132 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
3 files changed, 169 insertions(+), 1 deletion(-)
diff --git a/apps/cart/controllers/order.js b/apps/cart/controllers/order.js
index a871852..90043a6 100644
--- a/apps/cart/controllers/order.js
+++ b/apps/cart/controllers/order.js
@@ -363,7 +363,8 @@ exports.selectCoupons = (req, res) => {
selectCouponPage: true,
pageHeader: headerData,
pageFooter: false,
- localCss: true
+ localCss: true,
+ width750: true
});
};
diff --git a/apps/cart/views/action/select-coupons.hbs b/apps/cart/views/action/select-coupons.hbs
index e69de29..83d7779 100644
--- a/apps/cart/views/action/select-coupons.hbs
+++ b/apps/cart/views/action/select-coupons.hbs
@@ -0,0 +1,35 @@
+<div class="select-coupons-page">
+ <div class="filter-box">
+ <span class="valid">可用(99+)<span class="iconfont"></span></span>
+ <span class="invalid">不可用(99+)</span>
+ </div>
+ <div class="exchange-box">
+ <input type="text" placeholder="请输入优惠券码">
+ <button>兑换</button>
+ </div>
+ <div class="tip-box">
+ <div class="tips">
+ <p>店铺券、活动券、运费券可叠加使用；</p>
+ <p>跨店铺店铺券可以叠加使用，同一个店铺的店铺券不可叠加使用。</p>
+ </div>
+ <div class="close"><span class="iconfont"></span></div>
+ </div>
+ <div class="coupon-list">
+ <div class="coupon">
+ <div class="coupon-left">
+ <p class="value">¥
+ <span>100</span>
+ </p>
+ <p class="threshold">满499可用</p>
+ </div>
+ <div class="coupon-right">
+ <div class="info">
+ <p class="title">
+ <span>[店铺券]</span>Adidas Origins店铺使用</p>
+ <p class="time">2018.1.12-2018.5.20</p>
+ </div>
+ <div class="check"><span class="iconfont checkbox icon-cb-radio"></span></div>
+ </div>
+ </div>
+ </div>
+</div>
diff --git a/public/scss/cart/select-coupons.page.css b/public/scss/cart/select-coupons.page.css
index e69de29..c86ef9b 100644
--- a/public/scss/cart/select-coupons.page.css
+++ b/public/scss/cart/select-coupons.page.css
@@ -0,0 +1,132 @@
+body {
+ background-color: #f0f0f0;
+}
+
+.select-coupons-page {
+ .filter-box {
+ height: 88px;
+ display: flex;
+ padding: 14px 0;
+ box-shadow: 0 0 16px 0 #eee;
+ background-color: #fff;
+ position: relative;
+
+ span {
+ flex: 1;
+ line-height: 60px;
+ text-align: center;
+ border-right: 1px solid #e0e0e0;
+ color: #b0b0b0;
+ }
+
+ span:last-child {
+ border: none;
+ }
+ }
+
+ .exchange-box {
+ height: 90px;
+ padding: 16px 20px;
+ background-color: #fff;
+
+ input {
+ width: 580px;
+ height: 60px;
+ margin-right: 12px;
+ padding: 0 20px;
+ background-color: #f0f0f0;
+ border-radius: 4px;
+ border: none;
+ }
+
+ button {
+ width: 110px;
+ height: 60px;
+ border-radius: 4px;
+ font-size: 28px;
+ color: #fff;
+ background-color: #444;
+ }
+ }
+
+ .tip-box {
+ width: 100%;
+ padding: 14px 20px;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ color: #fff;
+ font-size: 22px;
+ background-color: #ff8083;
+ }
+
+ .coupon-list {
+ padding: 20px;
+
+ .coupon {
+ width: 710px;
+ height: 200px;
+ margin-bottom: 20px;
+
+ .coupon-left {
+ width: 200px;
+ height: 200px;
+ background-image: resolve("home/coupon/bg_left@2x.png");
+ background-size: 100% 100%;
+ float: left;
+ text-align: center;
+ padding-top: 32px;
+ }
+
+ .coupon-left > p {
+ color: #fc5960;
+ font-size: 24px;
+ font-weight: 300;
+
+ &.value > span {
+ font-size: 60px;
+ font-weight: 600;
+ }
+ }
+
+ .coupon-right {
+ width: 510px;
+ height: 200px;
+ background-image: resolve("home/coupon/bg_right@2x.png");
+ background-size: 100% 100%;
+ float: right;
+ padding: 22px 0 22px 22px;
+ font-size: 22px;
+ color: #b0b0b0;
+ position: relative;
+ display: flex;
+
+ .info {
+ flex: 1;
+ }
+
+ .info > .title {
+ font-size: 24px;
+ color: #444;
+ margin-bottom: 40px;
+ }
+
+ .info > .time {
+ margin-bottom: 26px;
+ }
+
+ .check {
+ width: 90px;
+ display: flex;
+ justify-content: center;
+ align-self: center;
+ }
+
+ .check > .iconfont {
+ font-size: 40px;
+ color: #444;
+ }
+ }
+ }
+ }
+}
--
libgit2 0.24.0