调整购物车
parent
e16133d9ba
commit
47435ab38d
|
@ -210,6 +210,7 @@ section .whoil .whoil-1 table tfoot td:last-child span {
|
||||||
section .whoil .whoil-1 .swiper-container {
|
section .whoil .whoil-1 .swiper-container {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
|
padding-bottom: 50px;
|
||||||
}
|
}
|
||||||
|
|
||||||
section .whoil .whoil-1 .swiper-container .swiper-text {
|
section .whoil .whoil-1 .swiper-container .swiper-text {
|
||||||
|
@ -350,3 +351,29 @@ section .whole .whole-1 .payment .order .oderbuy a,
|
||||||
section .whole .whole-1 .payment .order .oderhome a {
|
section .whole .whole-1 .payment .order .oderhome a {
|
||||||
color: #00a608;
|
color: #00a608;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.zhanw{height: 30px;width: 100%;background: #f5f5f5;}
|
||||||
|
.padding-zy320{padding: 0 320px;}
|
||||||
|
.backFF{background: #FFFFFF;}
|
||||||
|
.table-cbox{border-collapse: separate;border-spacing: 0px 17px;margin-top: -17px;}
|
||||||
|
.table-cbox thead tr th:nth-child(1){text-align: left;width: 110px;}
|
||||||
|
.table-cbox thead tr th:nth-child(2){text-align: left;width: 430px;}
|
||||||
|
.table-cbox thead tr th:nth-child(5){width: 110px;}
|
||||||
|
|
||||||
|
|
||||||
|
.table-cbox tbody tr td:nth-child(1){width: 130px;}
|
||||||
|
.table-cbox tbody tr td:nth-child(1) div{display: flex;}
|
||||||
|
.table-cbox tbody tr td:nth-child(1) div input{width: 15px;height: 15px;margin-right: 20px;}
|
||||||
|
.table-cbox tbody tr td:nth-child(2){font-size: 15px;color: #525252;width: 430px;}
|
||||||
|
.table-cbox tbody tr td:nth-child(2) div{width: 430px;}
|
||||||
|
.table-cbox tbody tr td:nth-child(3){font-size: 15px;color: #525252;}
|
||||||
|
.table-cbox tbody tr td:nth-child(4){font-size: 14px;font-weight: bold;color: #222222;}
|
||||||
|
.table-cbox tbody tr td:nth-child(5)>div{display: flex;align-items: center;justify-content: center;}
|
||||||
|
.add,.reduce{width: 17px;height: 23px;background: #f0f0f0;border: 1px solid #e5e5e5;cursor: pointer;}
|
||||||
|
.count-input{width: 39px;height: 23px;display: inline-block;text-align: center;border: 1px solid #aaaaaa;}
|
||||||
|
.table-cbox tbody tr td:nth-child(6){font-size: 14px;font-weight: bold;color: #CB1919;}
|
||||||
|
.table-cbox tbody tr td:nth-child(7){font-size: 14px;color: #222222;}
|
||||||
|
|
||||||
|
.jies-box{height: 50px;background: #f3f3f3;line-height: 50px;display: flex;justify-content: space-between;font-size: 14px;color: #333333;}
|
||||||
|
.jies-box>div:first-child{padding-left: 10px;}
|
||||||
|
.jies-box>div:first-child input{cursor: pointer;"}
|
||||||
|
|
|
@ -13,6 +13,7 @@ a {
|
||||||
|
|
||||||
section {
|
section {
|
||||||
background-color: #f5f5f5;
|
background-color: #f5f5f5;
|
||||||
|
padding-bottom: 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
section .whole {
|
section .whole {
|
||||||
|
@ -44,7 +45,10 @@ section .whole .whole-1 .commodity {
|
||||||
}
|
}
|
||||||
|
|
||||||
section .whole .whole-1 .Subtitle {
|
section .whole .whole-1 .Subtitle {
|
||||||
font-weight: 800;
|
font-weight: bold;
|
||||||
|
font-size: 15px;
|
||||||
|
margin-top: 16px;
|
||||||
|
flex-shrink: 0;margin-right: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
section .whole .whole-1 .Buyers {
|
section .whole .whole-1 .Buyers {
|
||||||
|
@ -52,7 +56,14 @@ section .whole .whole-1 .Buyers {
|
||||||
border-bottom: 1px solid #f2f2f2;
|
border-bottom: 1px solid #f2f2f2;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
}
|
}
|
||||||
|
textarea{
|
||||||
|
resize: none;
|
||||||
|
border: 1px solid #efefef;
|
||||||
|
width: 100%;
|
||||||
|
padding: 20px 10px;
|
||||||
|
outline: none;
|
||||||
|
height: 90px;
|
||||||
|
}
|
||||||
section .whole .whole-1 .Buyers #container span:nth-child(2) {
|
section .whole .whole-1 .Buyers #container span:nth-child(2) {
|
||||||
float: right;
|
float: right;
|
||||||
}
|
}
|
||||||
|
@ -74,6 +85,10 @@ section .whole .whole-1 .Buyers #container #wrap .address {
|
||||||
section .whole .whole-1 .Buyers #container #wrap .address .name {
|
section .whole .whole-1 .Buyers #container #wrap .address .name {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding: 10px 50px;
|
padding: 10px 50px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
section .whole .whole-1 .Buyers #container #wrap .address .name img {
|
||||||
|
position: absolute;right: 0;bottom: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
section .whole .whole-1 .Buyers #container #wrap .address .na-1 {
|
section .whole .whole-1 .Buyers #container #wrap .address .na-1 {
|
||||||
|
@ -104,35 +119,14 @@ section .whole .whole-1 .Buyers #container #read-more {
|
||||||
section .whole .whole-1 .opt {
|
section .whole .whole-1 .opt {
|
||||||
padding: 15px 0 0 0;
|
padding: 15px 0 0 0;
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
border-bottom: 1px solid #f2f2f2;
|
|
||||||
}
|
|
||||||
|
|
||||||
section .whole .whole-1 .opt ul .optall table {
|
|
||||||
width: 100%;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
section .whole .whole-1 .opt ul .optall #checkall {
|
|
||||||
margin-left: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
section .whole .whole-1 .opt ul .optall th {
|
|
||||||
height: 50px;
|
|
||||||
}
|
|
||||||
|
|
||||||
section .whole .whole-1 .opt ul .optall th span {
|
|
||||||
margin-left: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
section .whole .whole-1 .opt .checklist .among table {
|
|
||||||
width: 100%;
|
|
||||||
background-color: #fff;
|
|
||||||
}
|
}
|
||||||
/* 使用优惠券 */
|
/* 使用优惠券 */
|
||||||
section .whole .whole-1 .coupon {
|
section .whole .whole-1 .coupon {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
padding-bottom: 40px;
|
padding-bottom: 40px;
|
||||||
|
padding-left: 20px;
|
||||||
|
flex-wrap: wrap;
|
||||||
border-bottom: 1px solid #f2f2f2;
|
border-bottom: 1px solid #f2f2f2;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -140,44 +134,12 @@ section .whole .whole-1 .coupon .yh {
|
||||||
width: 262px;
|
width: 262px;
|
||||||
height: 130px;
|
height: 130px;
|
||||||
margin-right: 25px;
|
margin-right: 25px;
|
||||||
|
display: flex;flex-direction: column;align-items: center;cursor: pointer;margin-top: 26px;
|
||||||
}
|
}
|
||||||
|
|
||||||
section .whole .whole-1 .coupon .yh h1,
|
|
||||||
section .whole .whole-1 .coupon .yh h3,
|
|
||||||
section .whole .whole-1 .coupon .yh span {
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
section .whole .whole-1 .coupon .yh h1 {
|
|
||||||
font-size: 50px;
|
|
||||||
position: relative;
|
|
||||||
left: 30px;
|
|
||||||
top: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
section .whole .whole-1 .coupon .yh h3 {
|
|
||||||
font-size: 17px;
|
|
||||||
position: relative;
|
|
||||||
left: 91px;
|
|
||||||
top: -32px;
|
|
||||||
font-weight: 700;
|
|
||||||
}
|
|
||||||
|
|
||||||
section .whole .whole-1 .coupon .yh span {
|
|
||||||
position: relative;
|
|
||||||
left: 91px;
|
|
||||||
top: -32px;
|
|
||||||
}
|
|
||||||
|
|
||||||
section .whole .whole-1 .coupon .yh p {
|
|
||||||
color: #cb1919;
|
|
||||||
position: relative;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
/* 优惠卷的背景 */
|
/* 优惠卷的背景 */
|
||||||
section .whole .whole-1 .coupon .coupon-1 {
|
section .whole .whole-1 .coupon .coupon-1 {
|
||||||
background: url("../../img/images/coupon-1.png");
|
background: url("../../img/images/coupon-1.png");
|
||||||
margin-left: 50px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
section .whole .whole-1 .coupon .coupon-2 {
|
section .whole .whole-1 .coupon .coupon-2 {
|
||||||
|
@ -187,72 +149,51 @@ section .whole .whole-1 .coupon .coupon-2 {
|
||||||
section .whole .whole-1 .coupon .coupon-3 {
|
section .whole .whole-1 .coupon .coupon-3 {
|
||||||
background: url("../../img/images/coupon-3.png");
|
background: url("../../img/images/coupon-3.png");
|
||||||
}
|
}
|
||||||
|
|
||||||
section .whole .whole-1 .coupon .coupon-3 p {
|
|
||||||
color: #d2d2d2;
|
|
||||||
}
|
|
||||||
/* 备注 */
|
|
||||||
section .whole .whole-1 .remarks {
|
|
||||||
padding-top: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
section .whole .whole-1 .remarks .layui-textarea {
|
|
||||||
background-color: #fcfcfc;
|
|
||||||
}
|
|
||||||
/* 提交订单 */
|
/* 提交订单 */
|
||||||
section .whole .setall {
|
section .whole .setall {
|
||||||
margin: 20px auto;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
margin-top: 25px;
|
margin-top: 25px;
|
||||||
}
|
}
|
||||||
|
.foot-iframe {
|
||||||
|
margin-top: -30px;
|
||||||
|
color: rgb(255, 255, 255);
|
||||||
|
}
|
||||||
|
|
||||||
section .whole .setall .seta li {
|
#gotoTop {
|
||||||
margin-bottom: 20px;
|
float: right;
|
||||||
display: block;
|
|
||||||
position: relative;
|
position: relative;
|
||||||
left: 815px;
|
right: 50px;
|
||||||
text-align: center;
|
top: -50px;
|
||||||
width: 380px;
|
|
||||||
}
|
}
|
||||||
|
.zhanw{height: 30px;width: 100%;background: #f5f5f5;}
|
||||||
|
.table-box{text-align: center;width: 100%;}
|
||||||
|
.table-box tr:first-child{background-color: #f3f3f3;}
|
||||||
|
.table-box tr:first-child>th:first-child{text-align: left;padding: 22px 0 16px 20px;width: 480px;}
|
||||||
|
.table-box tr:first-child>th:nth-child(2){width: 150px;}
|
||||||
|
.table-box tr:first-child>th:nth-child(3){width: 80px;}
|
||||||
|
.table-box tr:first-child>th:nth-child(4){width: 180px;}
|
||||||
|
.table-box .item-box td:nth-child(1){width: 480px;text-align: left;padding: 20px;border-bottom: 1px solid #f2f2f2;}
|
||||||
|
.table-box .item-box td:nth-child(1) div{width: 480px;display: flex;}
|
||||||
|
.table-box .item-box td:nth-child(1) div div{font-size: 14px;line-height: 24px;color: #525252;margin-left: 10px;}
|
||||||
|
.table-box .item-box td:nth-child(2),.table-box .item-box td:nth-child(3),.table-box .item-box td:nth-child(4){padding: 20px;font-weight: bold;border-bottom: 1px solid #f2f2f2;}
|
||||||
|
.table-box .item-box td:nth-child(4){color: #CB1919;}
|
||||||
|
|
||||||
section .whole .setall .seta li span {
|
.yhquan{font-size: 15px;color: #333333;font-weight: bold;}
|
||||||
float: right;
|
.yhmoney{display: flex;align-items: center;margin-top: 20px;}
|
||||||
}
|
.yhmoney>div:first-child{font-size: 56px;color: #FFFFFF;font-weight: bold;margin-right: 10px;}
|
||||||
/* 送货地址 */
|
.yhdate{margin-top: 16px;font-size: 15px;color: #CB1919;}
|
||||||
section .whole .setall .total {
|
.yhyuan{font-size: 18px;font-weight: bold;color: #FFFFFF;}
|
||||||
border-top: 1px solid #e0e0e0;
|
.yhman{font-size: 14px;color: #FFFFFF;}
|
||||||
border-bottom: 1px solid #e0e0e0;
|
.yhguoqi{margin-top: 16px;font-size: 15px;color: #afafaf;}
|
||||||
}
|
|
||||||
|
|
||||||
section .whole .setall .total li {
|
|
||||||
display: block;
|
|
||||||
position: relative;
|
|
||||||
left: 752px;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 50px;
|
|
||||||
width: 445px;
|
|
||||||
}
|
|
||||||
|
|
||||||
section .whole .setall .total li span {
|
.setall>div:first-child{padding: 30px 20px;}
|
||||||
color: #cb1919;
|
.setall>div:nth-child(2){padding: 20px;}
|
||||||
font-size: 26px;
|
.msg-bei{display: flex;margin-top: 30px;}
|
||||||
font-weight: 800;
|
.price-box{line-height: 36px;font-size: 16px;color: #525252;border-bottom: 1px solid #efefef;}
|
||||||
float: right;
|
.price{width: 148px;display: inline-block;}
|
||||||
}
|
.allPrice{color: #CB1919;font-weight: bold;font-size: 24px;}
|
||||||
|
.cartAddress{font-size: 14px;color: #333333;opacity: .5;}
|
||||||
section .whole .setall .total li p {
|
.sumbtn-box{display: flex;justify-content: flex-end;padding: 30px 20px 30px 0;}
|
||||||
color: #ababab;
|
.sumbtn-box div{font-size: 18px;color: #FFFFFF;width: 142px;height: 45px;line-height: 45px;text-align: center;background: #CB1919;}
|
||||||
}
|
|
||||||
/* 提交按钮 */
|
|
||||||
section .whole .setall .subore {
|
|
||||||
padding: 30px 0px;
|
|
||||||
height: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
section .whole .setall .subore li {
|
|
||||||
padding: 15px 35px;
|
|
||||||
background-color: #cb1919;
|
|
||||||
color: #fff;
|
|
||||||
float: right;
|
|
||||||
}
|
|
|
@ -28,78 +28,71 @@
|
||||||
<body>
|
<body>
|
||||||
<!-- 头部导航 -->
|
<!-- 头部导航 -->
|
||||||
<iframe src="../../public/center-head.html" class="ty_herader" width="100%" height="285px" frameborder="0" scrolling="no"></iframe>
|
<iframe src="../../public/center-head.html" class="ty_herader" width="100%" height="285px" frameborder="0" scrolling="no"></iframe>
|
||||||
<div style="height: 30px;width: 100%;background: #f5f5f5;"></div>
|
<div class="zhanw"></div>
|
||||||
<section>
|
<section>
|
||||||
<div class="whoil" style="padding: 0px 320px;">
|
<div class="whoil padding-zy320">
|
||||||
<div class="whoil-1" style="background: #FFFFFF;">
|
<div class="whoil-1 backFF">
|
||||||
<div class="all">全部商品(20)</div>
|
<div class="all">全部商品(20)</div>
|
||||||
<!-- 选择 -->
|
<!-- 选择 -->
|
||||||
<table border="0" cellspacing="0" style="border-collapse: separate;border-spacing: 0px 17px;margin-top: -17px;">
|
<table class="table-cbox" border="0" cellspacing="0">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th style="text-align: left;width: 110px;"><input type="checkbox" id="ckAll" onclick="checkAll()">全选</th>
|
<th><input type="checkbox" id="ckAll" onclick="checkAll()">全选</th>
|
||||||
<th style="text-align: left;width: 430px;">商品</th>
|
<th>商品</th>
|
||||||
<th></th>
|
<th></th>
|
||||||
<th>单价</th>
|
<th>单价</th>
|
||||||
<th style="width: 110px;">数量</th>
|
<th>数量</th>
|
||||||
<th>小计</th>
|
<th>小计</th>
|
||||||
<th>操作</th>
|
<th>操作</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr class="inline" valign="top">
|
<tr class="inline" valign="top">
|
||||||
<td style="width: 130px;">
|
<td>
|
||||||
<div style="display: flex;">
|
<div>
|
||||||
<input type="checkbox" name="ck" style="width: 15px;height: 15px;margin-right: 20px;" onclick="check()">
|
<input type="checkbox" name="ck" onclick="check()">
|
||||||
<img src="../../img/images/1-1.png" alt="图片丢失" title="购物车图片一" />
|
<img src="../../img/images/1-1.png" alt="图片丢失" title="购物车图片一" />
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td style="font-size: 15px;color: #525252;width: 430px;">
|
<td><div>竹迪 客厅装饰画现代简约晶瓷画沙发背景墙挂画三联画餐厅墙画靠山书房壁画抽象艺术画 11时来运转8190</div></td>
|
||||||
<div style="width: 430px;">竹迪 客厅装饰画现代简约晶瓷画沙发背景墙挂画三联画餐厅墙画靠山书房壁画抽象艺术画 11时来运转8190</div>
|
<td><span>x3</span></td>
|
||||||
</td>
|
<td>¥188.00</td>
|
||||||
<td style="font-size: 15px;color: #525252;"><span>x3</span></td>
|
|
||||||
<td style="font-size: 14px;font-weight: bold;color: #222222;">¥188.00</td>
|
|
||||||
<td>
|
<td>
|
||||||
<div style="display: flex;align-items: center;justify-content: center;">
|
<div>
|
||||||
<div style="width: 17px;height: 23px;background: #f0f0f0;border: 1px solid #e5e5e5;cursor: pointer;" class="reduce" onclick="reduceCount(this)">-</div>
|
<div class="reduce" onclick="reduceCount(this)">-</div>
|
||||||
<input style="width: 39px;height: 23px;display: inline-block;text-align: center;border: 1px solid #aaaaaa;" type="text" value="3" class="count-input">
|
<input type="text" value="3" class="count-input">
|
||||||
<div style="width: 17px;height: 23px;background: #f0f0f0;border: 1px solid #e5e5e5;cursor: pointer;" class="add" onclick="addCount(this)">+</div>
|
<div class="add" onclick="addCount(this)">+</div>
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td style="font-size: 14px;font-weight: bold;color: #CB1919;">¥564.00</td>
|
<td>¥564.00</td>
|
||||||
<td>
|
<td class="delete" onclick="del(this)">删除</td>
|
||||||
<span class="delete" onclick="del(this)" style="font-size: 14px;color: #222222;">删除</span>
|
|
||||||
</td>
|
|
||||||
<tr class="inline" valign="top">
|
|
||||||
<td style="width: 130px;">
|
|
||||||
<div style="display: flex;">
|
|
||||||
<input type="checkbox" name="ck" style="width: 15px;height: 15px;margin-right: 20px;" onclick="check()">
|
|
||||||
<img src="../../img/images/1-1.png" alt="图片丢失" title="购物车图片一" />
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td style="font-size: 15px;color: #525252;width: 430px;">
|
|
||||||
<div style="width: 430px;">竹迪 客厅装饰画现代简约晶瓷画沙发背景墙挂画三联画餐厅墙画靠山书房壁画抽象艺术画 11时来运转8190</div>
|
|
||||||
</td>
|
|
||||||
<td style="font-size: 15px;color: #525252;"><span>x3</span></td>
|
|
||||||
<td style="font-size: 14px;font-weight: bold;color: #222222;">¥188.00</td>
|
|
||||||
<td>
|
|
||||||
<div style="display: flex;align-items: center;justify-content: center;">
|
|
||||||
<div style="width: 17px;height: 23px;background: #f0f0f0;border: 1px solid #e5e5e5;cursor: pointer;" class="reduce" onclick="reduceCount(this)">-</div>
|
|
||||||
<input style="width: 39px;height: 23px;display: inline-block;text-align: center;border: 1px solid #aaaaaa;" type="text" value="3" class="count-input">
|
|
||||||
<div style="width: 17px;height: 23px;background: #f0f0f0;border: 1px solid #e5e5e5;cursor: pointer;" class="add" onclick="addCount(this)">+</div>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
<td style="font-size: 14px;font-weight: bold;color: #CB1919;">¥564.00</td>
|
|
||||||
<td>
|
|
||||||
<span class="delete" onclick="del(this)" style="font-size: 14px;color: #222222;">删除</span>
|
|
||||||
</td>
|
|
||||||
</tr>
|
</tr>
|
||||||
|
<tr class="inline" valign="top">
|
||||||
|
<td>
|
||||||
|
<div>
|
||||||
|
<input type="checkbox" name="ck" onclick="check()">
|
||||||
|
<img src="../../img/images/1-1.png" alt="图片丢失" title="购物车图片一" />
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td><div>竹迪 客厅装饰画现代简约晶瓷画沙发背景墙挂画三联画餐厅墙画靠山书房壁画抽象艺术画 11时来运转8190</div></td>
|
||||||
|
<td><span>x3</span></td>
|
||||||
|
<td>¥188.00</td>
|
||||||
|
<td>
|
||||||
|
<div>
|
||||||
|
<div class="reduce" onclick="reduceCount(this)">-</div>
|
||||||
|
<input type="text" value="3" class="count-input">
|
||||||
|
<div class="add" onclick="addCount(this)">+</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td>¥564.00</td>
|
||||||
|
<td class="delete" onclick="del(this)">删除</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
<div style="height: 50px;background: #f3f3f3;line-height: 50px;display: flex;justify-content: space-between;font-size: 14px;color: #333333;">
|
<div class="jies-box">
|
||||||
<div style="padding-left: 10px;">
|
<div>
|
||||||
<input type="checkbox" style="cursor: pointer;" id="ckAll"><span style="margin-left: 4px;cursor: pointer;">全选</span>
|
<input type="checkbox" id="ckAll">
|
||||||
|
<span style="margin-left: 4px;cursor: pointer;">全选</span>
|
||||||
<span style="margin-left: 20px;cursor: pointer;">删除</span>
|
<span style="margin-left: 20px;cursor: pointer;">删除</span>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
|
@ -108,7 +101,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- 轮播图 -->
|
<!-- 轮播图 -->
|
||||||
<div class="swiper-container" style="padding-bottom: 50px;">
|
<div class="swiper-container">
|
||||||
<div class="swiper-text">推荐商品</div>
|
<div class="swiper-text">推荐商品</div>
|
||||||
<div class="swiper-wrapper">
|
<div class="swiper-wrapper">
|
||||||
<div class="swiper-slide"><img width="100%" alt="图片丢失" title="图片一" src="../../img/images/1.png">
|
<div class="swiper-slide"><img width="100%" alt="图片丢失" title="图片一" src="../../img/images/1.png">
|
||||||
|
|
|
@ -8,26 +8,14 @@
|
||||||
<link rel="stylesheet" href="../../css/logshoppingcar/tobepaid.css">
|
<link rel="stylesheet" href="../../css/logshoppingcar/tobepaid.css">
|
||||||
<link rel="stylesheet" type="text/css" href="../../css/foot.min.css" />
|
<link rel="stylesheet" type="text/css" href="../../css/foot.min.css" />
|
||||||
<script src="../../js/jquery-1.9.1.js" type="text/javascript" charset="utf-8"></script>
|
<script src="../../js/jquery-1.9.1.js" type="text/javascript" charset="utf-8"></script>
|
||||||
|
<script src="../../js/login_cart/login_cart.js" type="text/javascript" charset="utf-8"></script>
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<style>
|
|
||||||
.foot-iframe {
|
|
||||||
margin-top: -30px;
|
|
||||||
color: rgb(255, 255, 255);
|
|
||||||
}
|
|
||||||
|
|
||||||
#gotoTop {
|
|
||||||
float: right;
|
|
||||||
position: relative;
|
|
||||||
right: 50px;
|
|
||||||
top: -50px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<!-- 头部导航 -->
|
<!-- 头部导航 -->
|
||||||
<iframe src="../../public/center-head.html" class="ty_herader" width="100%" height="285px" frameborder="0" scrolling="no"></iframe>
|
<iframe src="../../public/center-head.html" class="ty_herader" width="100%" height="285px" frameborder="0" scrolling="no"></iframe>
|
||||||
<div style="height: 30px;width: 100%;background: #f5f5f5;"></div>
|
<div class="zhanw"></div>
|
||||||
<!-- 内容 -->
|
<!-- 内容 -->
|
||||||
<section>
|
<section>
|
||||||
<div class="whole">
|
<div class="whole">
|
||||||
|
@ -42,12 +30,17 @@
|
||||||
<span><a class="addbuy" href="">新增收货地址</a></span>
|
<span><a class="addbuy" href="">新增收货地址</a></span>
|
||||||
<div id="wrap">
|
<div id="wrap">
|
||||||
<div class="address address-1" onclick="Subtitle();">
|
<div class="address address-1" onclick="Subtitle();">
|
||||||
<div class="name na-1">程鹏龙</div>
|
<div class="name na-1">程鹏龙<img src="../../img/public/chooseAddress.png" ></div>
|
||||||
<p>程鹏龙 四川 成都市 武侯区 城区 人民南路四段成科西路3号 138****1234</p>
|
<p>程鹏龙 四川 成都市 武侯区 城区 人民南路四段成科西路3号 138****1234</p>
|
||||||
<a class="" href=""><img src="../../img/images/Defadd.png" alt=""></a>
|
<a class="" href=""><img src="../../img/images/Defadd.png" alt=""></a>
|
||||||
</div>
|
</div>
|
||||||
<div class="address address-2" onclick="Subtitle();">
|
<div class="address address-2" onclick="Subtitle();">
|
||||||
<div class="name na-2">程鹏龙</div>
|
<div class="name na-2">程鹏龙2</div>
|
||||||
|
<p>程鹏龙 四川 成都市 武侯区 城区 人民南路四段成科西路3号 138****1234</p>
|
||||||
|
<a class="" href="">设置为默认地址</a>
|
||||||
|
</div>
|
||||||
|
<div class="address address-2" onclick="Subtitle();">
|
||||||
|
<div class="name na-2">程鹏龙2</div>
|
||||||
<p>程鹏龙 四川 成都市 武侯区 城区 人民南路四段成科西路3号 138****1234</p>
|
<p>程鹏龙 四川 成都市 武侯区 城区 人民南路四段成科西路3号 138****1234</p>
|
||||||
<a class="" href="">设置为默认地址</a>
|
<a class="" href="">设置为默认地址</a>
|
||||||
</div>
|
</div>
|
||||||
|
@ -58,91 +51,116 @@
|
||||||
</div>
|
</div>
|
||||||
<!-- 送货清单 -->
|
<!-- 送货清单 -->
|
||||||
<div class="opt">
|
<div class="opt">
|
||||||
<span class="Subtitle" style="font-size: 15px;">送货清单</span>
|
<span class="Subtitle">送货清单</span>
|
||||||
<div class="commodity">
|
<div class="commodity">
|
||||||
<table style="text-align: center;width: 100%;" cellspacing="0" cellpadding="20">
|
<table class="table-box" cellspacing="0" cellpadding="20">
|
||||||
<tr style="background-color: #f3f3f3;">
|
<tr>
|
||||||
<th style="text-align: left;padding: 22px 0 16px 20px;width: 480px;">
|
<th>商品</th>
|
||||||
<span>商品</span>
|
|
||||||
</th>
|
|
||||||
<th>单价</th>
|
<th>单价</th>
|
||||||
<th>数量</th>
|
<th>数量</th>
|
||||||
<th>小计</th>
|
<th>小计</th>
|
||||||
</tr>
|
</tr>
|
||||||
<tr valign="top">
|
<tr class="item-box" valign="top">
|
||||||
<td style="width: 480px;text-align: left;padding: 20px;border-bottom: 1px solid #f2f2f2;">
|
<td>
|
||||||
<div style="width: 480px;display: flex;">
|
<div>
|
||||||
<img src="../../img/images/1-1.png" alt="图片丢失" title="商品1" >
|
<img src="../../img/images/1-1.png" alt="图片丢失" title="商品1" >
|
||||||
<div style="font-size: 14px;line-height: 24px;color: #525252;margin-left: 10px;">创意牛气冲天牛摆件现代简约家居装饰品牛摆设电视柜玄关办公室博古架抽象艺术工艺品 牛气冲天+运势如虹</div>
|
<div>创意牛气冲天牛摆件现代简约家居装饰品牛摆设电视柜玄关办公室博古架抽象艺术工艺品 牛气冲天+运势如虹</div>
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td style="padding: 20px;font-weight: bold;border-bottom: 1px solid #f2f2f2;">¥188</td>
|
<td>¥188</td>
|
||||||
<td style="padding: 20px;font-weight: bold;border-bottom: 1px solid #f2f2f2;">x3</td>
|
<td>x3</td>
|
||||||
<td id="price0" style="padding: 20px;font-weight: bold;color: #CB1919;border-bottom: 1px solid #f2f2f2;">¥564.6</td>
|
<td id="price0">¥564.6</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr valign="top">
|
<tr class="item-box" valign="top">
|
||||||
<td style="width: 480px;text-align: left;padding: 20px;border-bottom: 1px solid #f2f2f2;">
|
<td>
|
||||||
<div style="width: 480px;display: flex;">
|
<div>
|
||||||
<img src="../../img/images/1-1.png" alt="图片丢失" title="商品1" >
|
<img src="../../img/images/1-1.png" alt="图片丢失" title="商品1" >
|
||||||
<div style="font-size: 14px;line-height: 24px;color: #525252;margin-left: 10px;">创意牛气冲天牛摆件现代简约家居装饰品牛摆设电视柜玄关办公室博古架抽象艺术工艺品 牛气冲天+运势如虹</div>
|
<div>创意牛气冲天牛摆件现代简约家居装饰品牛摆设电视柜玄关办公室博古架抽象艺术工艺品 牛气冲天+运势如虹</div>
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td style="padding: 20px;font-weight: bold;border-bottom: 1px solid #f2f2f2;">¥188</td>
|
<td>¥188</td>
|
||||||
<td style="padding: 20px;font-weight: bold;border-bottom: 1px solid #f2f2f2;">x3</td>
|
<td>x3</td>
|
||||||
<td id="price0" style="padding: 20px;font-weight: bold;color: #CB1919;border-bottom: 1px solid #f2f2f2;">¥564.6</td>
|
<td id="price0">¥564.6</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- 使用优惠券 -->
|
<!-- 使用优惠券 -->
|
||||||
|
<div class="yhquan">使用优惠券</div>
|
||||||
<div class="coupon">
|
<div class="coupon">
|
||||||
<div class="yh coupon-1" onclick="coupon1();">
|
<div class="yh coupon-1">
|
||||||
<h1>20</h1>
|
<div class="yhmoney">
|
||||||
<h3>元</h3>
|
<div>20</div>
|
||||||
<span>满300元,立减20元</span>
|
<div>
|
||||||
<p>有效期至:2020-09-31</p>
|
<div class="yhyuan">元</div>
|
||||||
|
<div class="yhman">满300元,立减20元</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="yh coupon-2" onclick="coupon2();">
|
|
||||||
<h1>20</h1>
|
|
||||||
<h3>元</h3>
|
|
||||||
<span>满300元,立减20元</span>
|
|
||||||
<p>有效期至:2020-09-31</p>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="yh coupon-3" onclick="coupon3();">
|
<div class="yhdate">有效期至:2020-09-31</div>
|
||||||
<h1>20</h1>
|
</div>
|
||||||
<h3>元</h3>
|
<div class="yh coupon-2">
|
||||||
<span>满300元,立减20元</span>
|
<div class="yhmoney">
|
||||||
<p>有效期至:2020-09-31</p>
|
<div>20</div>
|
||||||
|
<div>
|
||||||
|
<div class="yhyuan">元</div>
|
||||||
|
<div class="yhman">满300元,立减20元</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="yhdate">有效期至:2020-09-31</div>
|
||||||
|
</div>
|
||||||
|
<div class="yh coupon-3">
|
||||||
|
<div class="yhmoney">
|
||||||
|
<div>20</div>
|
||||||
|
<div>
|
||||||
|
<div class="yhyuan">元</div>
|
||||||
|
<div class="yhman">满300元,立减20元</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="yhguoqi">有效期至:2020-09-31</div>
|
||||||
|
</div>
|
||||||
|
<div class="yh coupon-3">
|
||||||
|
<div class="yhmoney">
|
||||||
|
<div>20</div>
|
||||||
|
<div>
|
||||||
|
<div class="yhyuan">元</div>
|
||||||
|
<div class="yhman">满300元,立减20元</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="yhguoqi">有效期至:2020-09-31</div>
|
||||||
|
</div>
|
||||||
|
<div class="yh coupon-3">
|
||||||
|
<div class="yhmoney">
|
||||||
|
<div>20</div>
|
||||||
|
<div>
|
||||||
|
<div class="yhyuan">元</div>
|
||||||
|
<div class="yhman">满300元,立减20元</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="yhguoqi">有效期至:2020-09-31</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- 备注 -->
|
<!-- 备注 -->
|
||||||
<div class="remarks">
|
<div class="msg-bei">
|
||||||
<div class="layui-form-item layui-form-text">
|
<label class="Subtitle">信息备注</label>
|
||||||
<label class="layui-form-label Subtitle">信息备注</label>
|
<textarea placeholder="请填写备注信息" class="layui-textarea" name="desc"></textarea>
|
||||||
<div class="layui-input-block">
|
|
||||||
<textarea placeholder="请输入内容" class="layui-textarea" name="desc"></textarea>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- 提交订单 -->
|
<!-- 提交订单 -->
|
||||||
<div class="setall">
|
<div class="setall">
|
||||||
<div style="line-height: 36px;font-size: 16px;color: #525252;">
|
<div class="price-box">
|
||||||
<div style="text-align: right;"><span>商品总金额:</span><span style="width: 200px;display: inline-block;">¥1128.00</span></div>
|
<div style="text-align: right;"><span>商品总金额:</span><span class="price">¥1128.00</span></div>
|
||||||
<div style="text-align: right;"><span>运费:</span><span style="width: 200px;display: inline-block;">¥0.00</span></div>
|
<div style="text-align: right;"><span>运费:</span><span class="price">¥0.00</span></div>
|
||||||
<div style="text-align: right;"><span>商品优惠:</span><span style="width: 200px;display: inline-block;">-¥20.00</span></div>
|
<div style="text-align: right;"><span>商品优惠:</span><span class="price">-¥20.00</span></div>
|
||||||
</div>
|
</div>
|
||||||
<!-- 送货地址 -->
|
<!-- 送货地址 -->
|
||||||
<div class="total">
|
<div class="price-box">
|
||||||
<li>应付总额:<span>¥1123.00</span></li>
|
<div style="text-align: right;"><span>应付总额:</span><span class="price allPrice">¥1123.00</span></div>
|
||||||
<li>
|
<div style="text-align: right;"><span class="cartAddress">程鹏龙 四川 成都市 武侯区 城区 人民南路四段成科西路3号 138****1234</span></div>
|
||||||
<p>程鹏龙 四川 成都市 武侯区 城区 人民南路四段成科西路3号 138****1234</p>
|
|
||||||
</li>
|
|
||||||
</div>
|
</div>
|
||||||
<!-- 提交按钮 -->
|
<!-- 提交按钮 -->
|
||||||
<div class="subore">
|
<div class="sumbtn-box">
|
||||||
<li><a href="qrcode.html" onclick="settlem();">提交订单</a></li>
|
<div>提交订单</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
Binary file not shown.
After Width: | Height: | Size: 1.1 KiB |
|
@ -211,6 +211,21 @@ $(function(){
|
||||||
$('#settlementt').on('click',function(){
|
$('#settlementt').on('click',function(){
|
||||||
location.href = "tobepaid.html"
|
location.href = "tobepaid.html"
|
||||||
})
|
})
|
||||||
|
$('.coupon .yh').on('click',function(){
|
||||||
|
var quanIndex = $(this).index()
|
||||||
|
if(quanIndex==0){
|
||||||
|
$('.coupon .yh').removeClass('coupon-1')
|
||||||
|
$('.coupon .yh').addClass('coupon-2')
|
||||||
|
$(this).removeClass('coupon-2')
|
||||||
|
$(this).addClass('coupon-1')
|
||||||
|
}
|
||||||
|
if(quanIndex==1){
|
||||||
|
$('.coupon .yh').removeClass('coupon-1')
|
||||||
|
$('.coupon .yh').addClass('coupon-2')
|
||||||
|
$(this).removeClass('coupon-2')
|
||||||
|
$(this).addClass('coupon-1')
|
||||||
|
}
|
||||||
|
})
|
||||||
})
|
})
|
||||||
function clearClose(){
|
function clearClose(){
|
||||||
num = 0
|
num = 0
|
||||||
|
|
Loading…
Reference in New Issue