From 47435ab38d505df1db6da2bae99a15ab1994000d Mon Sep 17 00:00:00 2001 From: chen <2659004835@qq.com> Date: Sat, 18 Sep 2021 11:47:36 +0800 Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E8=B4=AD=E7=89=A9=E8=BD=A6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- css/logshoppingcar/login_cart.css | 27 +++++ css/logshoppingcar/tobepaid.css | 171 ++++++++++------------------- htmls/logshoppingcar/shopcar.html | 95 ++++++++-------- htmls/logshoppingcar/tobepaid.html | 162 +++++++++++++++------------ img/public/chooseAddress.png | Bin 0 -> 1125 bytes js/login_cart/login_cart.js | 15 +++ 6 files changed, 232 insertions(+), 238 deletions(-) create mode 100644 img/public/chooseAddress.png diff --git a/css/logshoppingcar/login_cart.css b/css/logshoppingcar/login_cart.css index fdab1b7..09901d0 100644 --- a/css/logshoppingcar/login_cart.css +++ b/css/logshoppingcar/login_cart.css @@ -210,6 +210,7 @@ section .whoil .whoil-1 table tfoot td:last-child span { section .whoil .whoil-1 .swiper-container { width: 100%; background-color: #fff; + padding-bottom: 50px; } 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 { 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;"} diff --git a/css/logshoppingcar/tobepaid.css b/css/logshoppingcar/tobepaid.css index aecc4fa..a1e722d 100644 --- a/css/logshoppingcar/tobepaid.css +++ b/css/logshoppingcar/tobepaid.css @@ -13,6 +13,7 @@ a { section { background-color: #f5f5f5; + padding-bottom: 30px; } section .whole { @@ -44,7 +45,10 @@ section .whole .whole-1 .commodity { } 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 { @@ -52,7 +56,14 @@ section .whole .whole-1 .Buyers { border-bottom: 1px solid #f2f2f2; 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) { float: right; } @@ -74,6 +85,10 @@ section .whole .whole-1 .Buyers #container #wrap .address { section .whole .whole-1 .Buyers #container #wrap .address .name { display: inline-block; 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 { @@ -104,35 +119,14 @@ section .whole .whole-1 .Buyers #container #read-more { section .whole .whole-1 .opt { padding: 15px 0 0 0; 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 { width: 100%; display: inline-flex; padding-bottom: 40px; + padding-left: 20px; + flex-wrap: wrap; border-bottom: 1px solid #f2f2f2; } @@ -140,44 +134,12 @@ section .whole .whole-1 .coupon .yh { width: 262px; height: 130px; 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 { background: url("../../img/images/coupon-1.png"); - margin-left: 50px; } 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 { 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 { - margin: 20px auto; width: 100%; background-color: #fff; margin-top: 25px; } - -section .whole .setall .seta li { - margin-bottom: 20px; - display: block; - position: relative; - left: 815px; - text-align: center; - width: 380px; +.foot-iframe { + margin-top: -30px; + color: rgb(255, 255, 255); } -section .whole .setall .seta li span { - float: right; -} -/* 送货地址 */ -section .whole .setall .total { - border-top: 1px solid #e0e0e0; - border-bottom: 1px solid #e0e0e0; +#gotoTop { + float: right; + position: relative; + right: 50px; + top: -50px; } +.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 .total li { - display: block; - position: relative; - left: 752px; - text-align: center; - line-height: 50px; - width: 445px; -} +.yhquan{font-size: 15px;color: #333333;font-weight: bold;} +.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;} +.yhyuan{font-size: 18px;font-weight: bold;color: #FFFFFF;} +.yhman{font-size: 14px;color: #FFFFFF;} +.yhguoqi{margin-top: 16px;font-size: 15px;color: #afafaf;} -section .whole .setall .total li span { - color: #cb1919; - font-size: 26px; - font-weight: 800; - float: right; -} -section .whole .setall .total li p { - color: #ababab; -} -/* 提交按钮 */ -section .whole .setall .subore { - padding: 30px 0px; - height: 20px; -} - -section .whole .setall .subore li { - padding: 15px 35px; - background-color: #cb1919; - color: #fff; - float: right; -} +.setall>div:first-child{padding: 30px 20px;} +.setall>div:nth-child(2){padding: 20px;} +.msg-bei{display: flex;margin-top: 30px;} +.price-box{line-height: 36px;font-size: 16px;color: #525252;border-bottom: 1px solid #efefef;} +.price{width: 148px;display: inline-block;} +.allPrice{color: #CB1919;font-weight: bold;font-size: 24px;} +.cartAddress{font-size: 14px;color: #333333;opacity: .5;} +.sumbtn-box{display: flex;justify-content: flex-end;padding: 30px 20px 30px 0;} +.sumbtn-box div{font-size: 18px;color: #FFFFFF;width: 142px;height: 45px;line-height: 45px;text-align: center;background: #CB1919;} \ No newline at end of file diff --git a/htmls/logshoppingcar/shopcar.html b/htmls/logshoppingcar/shopcar.html index 2205a7c..5a04168 100644 --- a/htmls/logshoppingcar/shopcar.html +++ b/htmls/logshoppingcar/shopcar.html @@ -28,78 +28,71 @@ -
+
-
-
+
+
全部商品(20)
- +
- - + + - + - - - - + + + - - - - - - - - - - - + + + + + + + + + + +
全选商品全选商品 单价数量数量 小计 操作
-
- +
+
+ 图片丢失
-
竹迪 客厅装饰画现代简约晶瓷画沙发背景墙挂画三联画餐厅墙画靠山书房壁画抽象艺术画 11时来运转8190
- 		x3￥188.00
竹迪 客厅装饰画现代简约晶瓷画沙发背景墙挂画三联画餐厅墙画靠山书房壁画抽象艺术画 11时来运转8190
x3￥188.00 -
-
-
- -
+
+
+
-
+ +
+
￥564.00 - 删除 -
-
- - 图片丢失 -
- 		-
竹迪 客厅装饰画现代简约晶瓷画沙发背景墙挂画三联画餐厅墙画靠山书房壁画抽象艺术画 11时来运转8190
- 		x3￥188.00 -
-
-
- -
+
-
- 		￥564.00 - 删除 -
￥564.00删除
+
+ + 图片丢失 +
+
竹迪 客厅装饰画现代简约晶瓷画沙发背景墙挂画三联画餐厅墙画靠山书房壁画抽象艺术画 11时来运转8190
x3￥188.00 +
+
-
+ +
+
+
+ 		￥564.00删除
-
-
- 全选 +
+
+ + 全选 删除
@@ -108,7 +101,7 @@
-
+
推荐商品
图片丢失 diff --git a/htmls/logshoppingcar/tobepaid.html b/htmls/logshoppingcar/tobepaid.html index 667dee3..c5fe564 100644 --- a/htmls/logshoppingcar/tobepaid.html +++ b/htmls/logshoppingcar/tobepaid.html @@ -8,26 +8,14 @@ + - -
+
@@ -42,15 +30,20 @@ 新增收货地址
-
程鹏龙
+
程鹏龙

程鹏龙 四川 成都市 武侯区 城区 人民南路四段成科西路3号 138****1234

-
程鹏龙
+
程鹏龙2

程鹏龙 四川 成都市 武侯区 城区 人民南路四段成科西路3号 138****1234

设置为默认地址
+
+
程鹏龙2
+

程鹏龙 四川 成都市 武侯区 城区 人民南路四段成科西路3号 138****1234

+ 设置为默认地址 +
@@ -58,91 +51,116 @@
- 送货清单 + 送货清单
- - - +
- 商品 -
+ + - - + - - - + + + - - + - - - + + +
商品 单价 数量 小计
-
+
+
图片丢失 -
创意牛气冲天牛摆件现代简约家居装饰品牛摆设电视柜玄关办公室博古架抽象艺术工艺品 牛气冲天+运势如虹
+
创意牛气冲天牛摆件现代简约家居装饰品牛摆设电视柜玄关办公室博古架抽象艺术工艺品 牛气冲天+运势如虹
￥188x3￥564.6￥188x3￥564.6
-
+
+
图片丢失 -
创意牛气冲天牛摆件现代简约家居装饰品牛摆设电视柜玄关办公室博古架抽象艺术工艺品 牛气冲天+运势如虹
+
创意牛气冲天牛摆件现代简约家居装饰品牛摆设电视柜玄关办公室博古架抽象艺术工艺品 牛气冲天+运势如虹
￥188x3￥564.6￥188x3￥564.6
+
使用优惠券
-
-

20

-

元

- 满300元，立减20元 -

有效期至：2020-09-31

+
+
+
20
+
+
元
+
满300元，立减20元
+
+
+
有效期至：2020-09-31
-
-

20

-

元

- 满300元，立减20元 -

有效期至：2020-09-31

-
-
-

20

-

元

- 满300元，立减20元 -

有效期至：2020-09-31

+
+
+
20
+
+
元
+
满300元，立减20元
+
+
+
有效期至：2020-09-31
+
+
+
+
20
+
+
元
+
满300元，立减20元
+
+
+
有效期至：2020-09-31
+
+
+
20
+
+
元
+
满300元，立减20元
+
+
+
有效期至：2020-09-31
+
+
+
+
20
+
+
元
+
满300元，立减20元
+
+
+
有效期至：2020-09-31
+
-
-
- -
- -
-
-
+
+ + +
-
-
商品总金额：￥1128.00
-
运费：￥0.00
-
商品优惠：-￥20.00
+
+
商品总金额：￥1128.00
+
运费：￥0.00
+
商品优惠：-￥20.00
-
-
  • 应付总额:￥1123.00
    • -
  • -

    程鹏龙 四川 成都市 武侯区 城区 人民南路四段成科西路3号 138****1234

    -
    • -
    +
    +
    应付总额：￥1123.00
    +
    程鹏龙 四川 成都市 武侯区 城区 人民南路四段成科西路3号 138****1234
    +
    -
    -
  • 提交订单
    • +
    +
    提交订单
    diff --git a/img/public/chooseAddress.png b/img/public/chooseAddress.png new file mode 100644 index 0000000000000000000000000000000000000000..d35f4378ef9f62c96631163d2eca8b42223c954d GIT binary patch literal 1125 zcmaJ=OK8+U7!FoJq(yuj)YA}AESk+Eo5v<}E9<7Ki`}|xmv#@LPBXJ@Y?Fz})ZG@* zB6v^`tEeb=D~t3gSsCcn~}YPP*Odp%}hxHOHg?TdO?VFCs z;PgP%ogQ~BEbi_FJx!Y%@Ciep=}!c)-OP#$c5Qx6#Igt$RM>b{Yz0*-l|i0H1n4P4 zaurPlrj=3*XsOyRphCrzp(!hA2`V-;?6d_IKaqQjaNVvrg+*WdmKDbs3vF3$G#aT! zIz^*VS+OijhN`Tp64#L8seqxT6vSKG790}0kry(L1|YGBM(8BViagR*3Vv8BEg25t z#X|9t$xRf>N(#!ppX9Zm9kUAg8^*HQadj#ra)rcnGIDu8>Ra1jUc3K0N)&lC_JPRb zO+gb5btioiu%eR{`AZ6W*ftDkS{ZXhLaJ^^YDP08Vt(6+ukzn(-51cq3Dus5GZ97jW21E zk)R2&Yu2$v(uTN*$N!YBHKJU?QwZCU*t(*+2q9H6v1UprtyxmWREcD`*hMZ>ETq>( znTIGRQ}fRhwMBe1lj9O6_+^PzB;ZtvIA_iun(yR%J5h9U)#ke!uitmgfX-FrO&wpt z{%iejX7!^_SH74#6Fpg5T>D{Wl`wbU-0PX%#_C&f{lcevx9`_}e7in3d$}7w86vN) zex7}~?b-IqkxLujUR=NP*4G~=LHEx1_x&rsee%G%dFkNuSLLDNuWjoFf9}72_tCw_ b@Pg1G=tJ}L