order.vue 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839
  1. <template>
  2. <view>
  3. <view class="custom_addr" @click="showAddrPopup()">
  4. <view class="contact_user">
  5. <text class="contact_none" v-if="!checkedAddr.id">请选择收货地址</text>
  6. <text class="contact_name" >{{checkedAddr.contact_name}}</text>
  7. <text class="contact_phone" >{{checkedAddr.contact_phone}}</text>
  8. <text class="contact_more"> &gt;</text>
  9. <text class="contact_shop" >{{checkedAddr.contact_shop}}</text>
  10. </view>
  11. <view class="contact_addr">
  12. {{checkedAddr.contact_province}} {{checkedAddr.contact_city}} {{checkedAddr.contact_area}} {{checkedAddr.contact_addr}}
  13. </view>
  14. </view>
  15. <view class="car_list">
  16. <view class="car_item" v-for="(item,index) in cartList" :key="index">
  17. <view class="box_left">
  18. <image class="car_image" :src="item.thumb" mode=""></image>
  19. </view>
  20. <view class="box_center">
  21. <view class="car_name">{{item.name}}</view>
  22. <view class="car_spec">{{item.spec}}</view>
  23. <view v-if="item.promo_title" class="promo_title">{{item.promo_title}}</view>
  24. <view class="car_price">
  25. <text class="price">¥{{item.price}}</text>
  26. </view>
  27. </view>
  28. <view class="box_right">
  29. <view class="buy_num_box">
  30. <view class="buy_num">共{{item.buy_num}}件</view>
  31. </view>
  32. </view>
  33. </view>
  34. <view class="car_item" v-for="(item,index) in promoRebateList" :key="index">
  35. <view class="box_left">
  36. <image class="car_image" :src="item.thumb" mode=""></image>
  37. </view>
  38. <view class="box_center">
  39. <view class="car_name"><text v-if="item.promo_rebate_id">【赠品】</text>{{item.name}}</view>
  40. <view class="car_spec">{{item.spec}}</view>
  41. <view class="car_price">
  42. <text class="price">¥{{item.price}}</text>
  43. </view>
  44. </view>
  45. <view class="box_right">
  46. <view class="buy_num_box">
  47. <view class="buy_num">共{{item.buy_num}}件</view>
  48. </view>
  49. </view>
  50. </view>
  51. </view>
  52. <view class="to_select_coupon" v-if="couponList.length" @click="popupCoupon()">
  53. <text>优惠券</text>
  54. <view class="coupon_deduction">{{couponUsed}}</view>
  55. </view>
  56. <view class="to_select_coupon" v-if="reduction > 0">
  57. <text>满减</text>
  58. <view class="coupon_deduction">-{{reduction}}</view>
  59. </view>
  60. <view class="to_select_coupon" v-if="discount > 0">
  61. <text>商品折扣</text>
  62. <view class="coupon_deduction">-{{discount}}</view>
  63. </view>
  64. <view class="bottom_box">
  65. <view class="price_box">
  66. 合计:<text class="price_total">¥{{priceTotal}}</text>
  67. </view>
  68. <button class="to_order" @click="createOrder()" data-eventsync="true">提交预约</button>
  69. </view>
  70. <uni-popup ref="popup" type="bottom" class="popup" background-color="#FFFFFF" @touchmove.stop.prevent="()=>{}">
  71. <view class="coupon_list">
  72. <view class="coupon_item" v-for="(item,index) in couponList" :key="index" @click="checkedCoupon(index)">
  73. <view class="box_left">
  74. <view class="rebate" v-if="item.rebate_type == 1" > ¥{{item.rebate}}</view>
  75. <view class="rebate" v-if="item.rebate_type == 2" > 打 {{item.rebate}} 折</view>
  76. <view class="rebate" v-if="item.rebate_type == 3" >
  77. <text v-if="item.rebate_scope.length"> {{item.rebate_scope[0].product_name}} </text>
  78. </view>
  79. <view class="std_pay"> 满{{item.std_pay}}</view>
  80. </view>
  81. <view class="box_right">
  82. <view class="coupon_title">
  83. <view class="coupon_name" v-if="item.rebate_type == 1">满减券</view>
  84. <view class="coupon_name" v-if="item.rebate_type == 2">折扣券</view>
  85. <view class="coupon_name" v-if="item.rebate_type == 3">赠品券</view>
  86. </view>
  87. <view class="product_scope">
  88. <text class="" v-if="item.type_id == 1">限定商品可用</text>
  89. <text class="" v-if="item.type_id == 2">全场可用</text>
  90. <view class="check_label" >
  91. <view class="isstd" v-if="!item.is_std">不可用</view>
  92. <image class="checkbox" v-if="item.is_std" :src="item.checked?'../../static/icon/checked.png':'../../static/icon/checkbox.png'"></image>
  93. </view>
  94. </view>
  95. <view class="coupon_info">
  96. <view class="coupon_exp">{{item.exp_time}} 到期</view>
  97. </view>
  98. </view>
  99. </view>
  100. </view>
  101. </uni-popup>
  102. <uni-popup ref="addrPopup" type="bottom" class="popup" background-color="#FFFFFF" >
  103. <view class="popup_title">收货地址 <navigator url="/pages/addr/index?notify=addr" class="to_addr_page">管理</navigator> </view>
  104. <view class="addr_list">
  105. <view class="addr_item" v-for="(item,index) in addrList" :key="index" @click="checkedAddrItem(item)">
  106. <view class="radio_label">
  107. <image class="radio_icon" :src="item.id == checkedAddr.id? '../../static/icon/radioed.png' : '../../static/icon/radio.png'" ></image>
  108. </view>
  109. <view class="contact_user">
  110. <text class="contact_name">{{item.contact_name}}</text>
  111. <text class="contact_phone">{{item.contact_phone}}</text>
  112. <text class="contact_default" v-if="item.is_default">默认</text>
  113. </view>
  114. <view class="contact_addr">
  115. {{item.contact_province}} {{item.contact_city}} {{item.contact_area}} {{item.contact_addr}}
  116. </view>
  117. </view>
  118. </view>
  119. <view class="create_box">
  120. <navigator url="/pages/addr/index?notify=addr&type=create" class="create_addr" >新建收货地址</navigator>
  121. </view>
  122. </uni-popup>
  123. </view>
  124. </template>
  125. <script>
  126. export default {
  127. data() {
  128. return {
  129. // 购物车列表
  130. cartList:[],
  131. // 优惠券列表
  132. couponList:[],
  133. //赠品列表
  134. promoRebateList:[],
  135. // 请求参数
  136. requestParam:{
  137. cart_ids:"",
  138. },
  139. // 总价
  140. priceTotal:'0.00',
  141. discount:'0.00',
  142. reduction:'0.00',
  143. // 优惠券使用
  144. couponUsed:"去使用 >",
  145. // 扣减金额
  146. rebatePrice:0.00,
  147. // 已经选择的优惠券ID
  148. customCoupon: 0,
  149. // 地址列表
  150. addrList:[],
  151. // 已选地址
  152. checkedAddr:{
  153. id:0,
  154. contact_name:"",
  155. contact_phone:"",
  156. contact_province:"",
  157. contact_city:"",
  158. contact_area:"",
  159. contact_addr:"",
  160. is_default:0,
  161. }
  162. }
  163. },
  164. onLoad(param) {
  165. // 获取路由参数
  166. this.requestParam.cart_ids = param.cart_ids;
  167. var that = this;
  168. // 监听地址变动
  169. uni.$on('addr_list_change',function(data){
  170. // 地址列表
  171. that.addrList = data.list;
  172. })
  173. },
  174. onShow() {
  175. // 结果
  176. this.$http.request('api/shop_cart/check_list',this.requestParam).then((re)=>{
  177. if( re.code == 'success' ){
  178. // 赋值
  179. this.cartList = re.data;
  180. this.promoRebateList = re.promoRebateList;
  181. this.discount = re.discount;
  182. this.reduction = re.reduction;
  183. // 结果
  184. this.$http.request('api/custom_coupon/get_checked',this.requestParam).then((re)=>{
  185. if( re.code == 'success' ){
  186. // 赋值
  187. this.couponList = re.data;
  188. // 推荐使用的优惠券
  189. let rebatePrice = 0;
  190. // 循环优惠券
  191. for (let i in this.couponList) {
  192. /* 商品的总价格,决定是否可用 */
  193. var totalPrice = 0.00;
  194. // 循环产品,
  195. for (let j in this.cartList) {
  196. // 如果是商品券
  197. if( this.couponList[i].type_id == 1 ){
  198. // 判断商品是不是在商品范围
  199. var isScope = false;
  200. // 循环商品范围
  201. for (let k in this.couponList[i].product_scope) {
  202. // 如果存在商品范围
  203. if( this.couponList[i].product_scope[k].product_id == this.cartList[j].product_id) isScope = true;
  204. }
  205. // 范围内的做计算
  206. if( isScope ){
  207. totalPrice = this.$decimal.add(totalPrice,this.$decimal.mul(this.cartList[j].price,this.cartList[j].buy_num));
  208. }
  209. // 如果排除商品
  210. }else if( this.couponList[i].type_id == 3 ){
  211. // 判断商品是不是在排除范围
  212. var isExclude = false;
  213. // 循环排除范围
  214. for (let k in this.couponList[i].product_exclude) {
  215. // 如果存在排除范围
  216. if( this.couponList[i].product_exclude[k].product_id == this.cartList[j].product_id) isExclude = true;
  217. }
  218. // 不在排除内的做计算
  219. if( !isExclude ){
  220. totalPrice = this.$decimal.add(totalPrice,this.$decimal.mul(this.cartList[j].price,this.cartList[j].buy_num));
  221. }
  222. // 店铺券
  223. }else{
  224. // 折扣券以及满减券的话,计算价格
  225. totalPrice = this.$decimal.add(totalPrice,this.$decimal.mul(this.cartList[j].price,this.cartList[j].buy_num));
  226. }
  227. // 判断价格到不到限额
  228. this.couponList[i].is_std = parseFloat(totalPrice.toFixed(2)) >= parseFloat(this.$decimal.mul(this.couponList[i].std_pay,1).toFixed(2));
  229. // 如果可用的话,并且没有主动选择优惠券
  230. if( this.couponList[i].is_std ){
  231. // 优惠金额
  232. let newRebatePrice = 0.00;
  233. // 计算满减价格
  234. if( this.couponList[i].rebate_type == 1 ){
  235. // 计算扣减数据
  236. newRebatePrice = this.$decimal.mul(this.couponList[i].rebate,1);
  237. }
  238. // 计算折扣价格
  239. if( this.couponList[i].rebate_type == 2 ){
  240. // 折扣
  241. newRebatePrice = this.$decimal.mul(totalPrice,this.couponList[i].rebate);
  242. // 减数
  243. newRebatePrice = this.$decimal.sub(totalPrice,newRebatePrice.mul(0.1));
  244. }
  245. // 判断哪个比较优惠
  246. if( parseFloat(rebatePrice.toFixed(2)) < parseFloat(newRebatePrice.toFixed(2)) ){
  247. // 覆盖价格
  248. rebatePrice = parseFloat(newRebatePrice.toFixed(2));
  249. // 选中
  250. this.checkedCoupon(i);
  251. }
  252. }
  253. }
  254. }
  255. }
  256. });
  257. // 计算价格
  258. this.priceHandler();
  259. }
  260. });
  261. // 地址列表
  262. this.getAddrList();
  263. },
  264. methods: {
  265. // 地址弹出层
  266. showAddrPopup(){
  267. // 显示下单弹出层
  268. this.$refs.addrPopup.open('bottom');
  269. },
  270. // 价格计算
  271. priceHandler(){
  272. // 总价格
  273. let priceTotal = 0;
  274. // 循环处理
  275. for (let index in this.cartList) {
  276. priceTotal = this.$decimal.add(priceTotal,this.$decimal.mul(this.cartList[index].price,this.cartList[index].buy_num));
  277. }
  278. // 扣减数据
  279. priceTotal = this.$decimal.sub(priceTotal,this.rebatePrice);
  280. // 小数点保留
  281. this.priceTotal = priceTotal.toFixed(2)
  282. },
  283. // 创建订单
  284. createOrder(){
  285. // 不可预约
  286. if( !this.$checkAccess.alertCity() ) return;
  287. // 需要下单的产品列表
  288. let productList = [];
  289. // 循环列表数据
  290. for (let index in this.cartList) {
  291. // 购买数量必须大于0的才行
  292. if( this.cartList[index].buy_num > 0 ){
  293. // 追加需要下单的数据
  294. productList.push({product_id: this.cartList[index].product_id,buy_num:this.cartList[index].buy_num,product_skuid:this.cartList[index].skuid});
  295. }
  296. }
  297. if( productList.length <= 0) {
  298. uni.showToast({
  299. title:"未选择可预约的产品",
  300. icon:"none",
  301. })
  302. return ;
  303. }
  304. // 地址未填
  305. if( !this.checkedAddr.id ) {
  306. uni.showToast({
  307. title:"请选择收货地址",
  308. icon:"none"
  309. })
  310. return;
  311. }
  312. //需要下单的产品信息参数传给OrederCompletion页面
  313. let productInfo = [];
  314. for (let index in this.cartList) {
  315. // 购买数量必须大于0的才行
  316. if( this.cartList[index].buy_num > 0 ){
  317. // 追加需要下单的数据
  318. productInfo.push({name:this.cartList[index].name,spec:this.cartList[index].spec,price:this.cartList[index].price});
  319. }
  320. }
  321. // 转成json字符串
  322. productInfo = JSON.stringify(productInfo);
  323. //加密json格式成编码数组
  324. let encodedArray = encodeURIComponent(productInfo);
  325. // 转成json字符串传输
  326. productList = JSON.stringify(productList);
  327. // 请求接口
  328. this.$http.request('api/orders/create',{"product_list":productList,'custom_coupon_id':this.customCoupon,'is_cart':1,'addr_id':this.checkedAddr.id},'post').then((re)=>{
  329. // 判断结果
  330. if( re.code == 'success' ) {
  331. // 跳转到报单完成页面
  332. uni.redirectTo({url:`/pages/orders/completion?params=${encodedArray}`})
  333. return ;
  334. }else{
  335. uni.showToast({title: re.msg,icon:"none"})
  336. }
  337. });
  338. },
  339. // 弹出优惠券
  340. popupCoupon(){
  341. this.$refs.popup.open();
  342. },
  343. // 选择优惠券
  344. checkedCoupon(index){
  345. // 单个设置选中/未选
  346. this.couponList[index].checked = this.couponList[index].checked ? 0 : 1;
  347. // 循环处理
  348. for (let i in this.couponList) {
  349. // 有未选的就不做全选
  350. if( index != i ) this.couponList[i].checked = 0;
  351. }
  352. // 如果未选中,提示可用
  353. if( !this.couponList[index].checked ) this.couponUsed = '去使用 >';
  354. // 已经选择的优惠券ID
  355. this.customCoupon = this.couponList[index].checked ? this.couponList[index].id : 0
  356. // 计算扣减
  357. this.couponRebate();
  358. // 计算价格
  359. this.priceHandler();
  360. // 关闭弹窗
  361. this.$refs.popup.close();
  362. },
  363. // 计算优惠券扣减
  364. couponRebate(){
  365. // 默认扣减0
  366. this.rebatePrice = 0;
  367. // 循环优惠券
  368. for (let i in this.couponList) {
  369. // 判断是否选中
  370. if( !this.couponList[i].checked ){
  371. // 未选择的不管
  372. continue;
  373. }
  374. /* 商品的总价格,决定是否可用 */
  375. var totalPrice = 0.00;
  376. // 循环产品,
  377. for (let j in this.cartList) {
  378. // 如果是商品券
  379. if( this.couponList[i].type_id == 1 ){
  380. // 判断商品是不是在商品范围
  381. var isScope = false;
  382. // 循环商品范围
  383. for (let k in this.couponList[i].product_scope) {
  384. // 如果存在商品范围
  385. if( this.couponList[i].product_scope[k].product_id == this.cartList[j].product_id) isScope = true;
  386. }
  387. // 范围内的做计算
  388. if( isScope ) totalPrice = this.$decimal.add(totalPrice,this.$decimal.mul(this.cartList[j].price,this.cartList[j].buy_num));
  389. // 店铺券
  390. }else{
  391. // 折扣券以及满减券的话,计算价格
  392. totalPrice = this.$decimal.add(totalPrice,this.$decimal.mul(this.cartList[j].price,this.cartList[j].buy_num));
  393. }
  394. }
  395. // 如果是可以用的话
  396. if( parseFloat(totalPrice.toFixed(2)) >= parseFloat(this.$decimal.mul(this.couponList[i].std_pay,1).toFixed(2)) ){
  397. // 扣减金额
  398. let rebatePrice = 0;
  399. // 满减
  400. if( this.couponList[i].rebate_type == 1 ){
  401. // 计算扣减数据
  402. rebatePrice = this.$decimal.mul(this.couponList[i].rebate,1);
  403. // 替换文字
  404. this.couponUsed = "¥-" + rebatePrice.toFixed(2);
  405. }
  406. // 折扣
  407. if( this.couponList[i].rebate_type == 2 ){
  408. // 折扣
  409. rebatePrice = this.$decimal.mul(totalPrice,this.couponList[i].rebate);
  410. // -0.1 表示折扣
  411. rebatePrice = this.$decimal.sub(totalPrice,rebatePrice.mul(0.1));
  412. // 替换文字
  413. this.couponUsed = "¥-" + rebatePrice.toFixed(2);
  414. }
  415. // 赠品
  416. if( this.couponList[i].rebate_type == 3 ){
  417. // 替换文字
  418. this.couponUsed = "送" + ( this.couponList[i].rebate_scope.length ? this.couponList[i].rebate_scope[0].product_name: "");
  419. }
  420. // 小数点保留
  421. this.rebatePrice = rebatePrice.toFixed(2);
  422. }
  423. }
  424. },
  425. // 选择地址
  426. checkedAddrItem(item){
  427. this.checkedAddr = item;
  428. this.$refs.addrPopup.close();
  429. },
  430. getAddrList(){
  431. // 判断数据
  432. this.$http.request('api/custom_addr/get_list').then((callback)=>{
  433. // 获取成功
  434. if( callback.code == 'success' ){
  435. this.addrList = callback.data;
  436. // 如果有的话
  437. if( this.addrList.length ){
  438. // 获取默认的
  439. for (let i in this.addrList) {
  440. // 如果是默认的
  441. if( this.addrList[i].is_default ) this.checkedAddr = this.addrList[i];
  442. }
  443. // 如果没有默认的话
  444. if( !this.checkedAddr.id ){
  445. this.checkedAddr = this.addrList[this.addrList.length-1];
  446. }
  447. }
  448. }
  449. });
  450. }
  451. }
  452. }
  453. </script>
  454. <style lang="less">
  455. .custom_addr{
  456. width: 680rpx;
  457. display: block;
  458. font-size: 24rpx;
  459. overflow: hidden;
  460. margin: 0rpx auto;
  461. line-height: 40rpx;
  462. padding: 20rpx 35rpx;
  463. background-color: #FFFFFF;
  464. border-bottom: 2rpx solid #dddddd;
  465. .contact_user{
  466. display: block;
  467. font-size: 24rpx;
  468. line-height: 50rpx;
  469. .contact_none{
  470. font-size: 26rpx;
  471. font-weight: bold;
  472. }
  473. .contact_name{
  474. font-size: 26rpx;
  475. font-weight: bold;
  476. margin-right: 16rpx;
  477. }
  478. .contact_more{
  479. float: right;
  480. font-size: 40rpx;
  481. font-weight: bold;
  482. }
  483. .contact_shop{
  484. float: right;
  485. font-size: 26rpx;
  486. margin-right: 16rpx;
  487. }
  488. }
  489. .contact_addr{
  490. width: 620rpx;
  491. display: block;
  492. font-size: 24rpx;
  493. line-height: 30rpx;
  494. padding: 10rpx 5rpx;
  495. }
  496. }
  497. .car_list{
  498. display: block;
  499. overflow: hidden;
  500. margin: 0rpx auto;
  501. margin-top: 20rpx;
  502. background: #FFFFFF;
  503. .car_item{
  504. height: 170rpx;
  505. display: block;
  506. overflow: hidden;
  507. margin: 0rpx auto;
  508. padding: 20rpx 35rpx;
  509. border-bottom: 2rpx solid #DDDDDD;
  510. .box_left{
  511. float: left;
  512. width: 140rpx;
  513. height: 190rpx;
  514. margin-top: 10rpx;
  515. .car_image{
  516. width: 140rpx;
  517. height: 140rpx;
  518. border-radius: 5rpx;
  519. }
  520. }
  521. .box_center{
  522. float: left;
  523. width: 300rpx;
  524. margin-left: 25rpx;
  525. .car_name{
  526. max-height: 70rpx;
  527. font-size: 30rpx;
  528. line-height: 40rpx;
  529. overflow: hidden;
  530. white-space: nowrap; /* 不换行 */
  531. overflow: hidden; /* 隐藏超出的内容 */
  532. text-overflow: ellipsis; /* 用省略号表示被隐藏的部分 */
  533. }
  534. .car_spec{
  535. color: #999999;
  536. font-size: 24rpx;
  537. line-height: 60rpx;
  538. max-height: 60rpx;
  539. overflow: hidden;
  540. }
  541. .promo_title{
  542. max-height: 80rpx;
  543. font-size: 20rpx;
  544. line-height: 40rpx;
  545. overflow: hidden;
  546. padding: 0rpx 0rpx;
  547. color: #dd524d;
  548. }
  549. .car_price{
  550. font-size: 30rpx;
  551. line-height: 60rpx;
  552. .price{
  553. color: red;
  554. }
  555. }
  556. }
  557. .box_right{
  558. float: right;
  559. width: 185rpx;
  560. .buy_num_box{
  561. float: right;
  562. color: #333333;
  563. overflow: hidden;
  564. font-size: 24rpx;
  565. margin-top: 130rpx;
  566. text-align: center;
  567. .buy_num{
  568. float: left;
  569. width: 100rpx;
  570. height: 30rpx;
  571. font-size: 24rpx;
  572. line-height: 30rpx;
  573. padding: 0rpx 0rpx;
  574. border-radius: 8rpx;
  575. }
  576. }
  577. }
  578. }
  579. .car_item:last-child{
  580. border-bottom: none;
  581. }
  582. }
  583. .to_select_coupon{
  584. display: block;
  585. height: 120rpx;
  586. font-size: 30rpx;
  587. margin: 20rpx auto;
  588. background: #FFFFFF;
  589. padding: 0rpx 35rpx;
  590. line-height: 120rpx;
  591. .coupon_deduction{
  592. color: red;
  593. float: right;
  594. font-size: 26rpx;
  595. }
  596. }
  597. .bottom_box{
  598. left: 0rpx;
  599. z-index: 9;
  600. width: 100%;
  601. height: 140rpx;
  602. display: block;
  603. position: fixed;
  604. overflow: hidden;
  605. background: #FFFFFF;
  606. padding: 0rpx 35rpx;
  607. bottom: var(--window-bottom);
  608. .price_box{
  609. float: left;
  610. width: 500rpx;
  611. display: block;
  612. color: #666666;
  613. font-size: 26rpx;
  614. text-align: right;
  615. line-height: 100rpx;
  616. margin-right: 20rpx;
  617. .price_total{
  618. color: red;
  619. font-size: 30rpx;
  620. }
  621. }
  622. .to_order{
  623. float: left;
  624. width: 180rpx;
  625. height: 80rpx;
  626. display: block;
  627. color: #FFFFFF;
  628. font-size: 28rpx;
  629. margin-top: 10rpx;
  630. line-height: 80rpx;
  631. padding: 0rpx 0rpx;
  632. text-align: center;
  633. border-radius: 40rpx;
  634. background-color: #E03519;
  635. }
  636. }
  637. .popup{
  638. .popup_title{
  639. display: block;
  640. overflow: hidden;
  641. margin: 0rpx auto;
  642. font-size: 36rpx;
  643. height: 120rpx;
  644. line-height: 120rpx;
  645. padding: 0rpx 20rpx;
  646. border-bottom: 10rpx solid #F8F8F8;
  647. .to_addr_page{
  648. float: right;
  649. color: #F59A23;
  650. display: block;
  651. height: 120rpx;
  652. line-height: 120rpx;
  653. font-size: 26rpx;
  654. padding: 0rpx 10rpx;
  655. }
  656. }
  657. .coupon_list{
  658. display: block;
  659. overflow: hidden;
  660. margin: 10rpx auto;
  661. min-height: 600rpx;
  662. background: #FFFFFF;
  663. padding-bottom: 50rpx;
  664. .coupon_item{
  665. height: 200rpx;
  666. display: block;
  667. margin: 10rpx auto;
  668. border-bottom: 2rpx solid #DDDDDD;
  669. .box_left{
  670. float: left;
  671. width: 160rpx;
  672. height: 160rpx;
  673. font-size: 20rpx;
  674. text-align: center;
  675. margin-left: 35rpx;
  676. line-height: 60rpx;
  677. margin-top: 20rpx;
  678. background: pink;
  679. .rebate{
  680. width: 120rpx;
  681. height: 60rpx;
  682. margin: 0rpx auto;
  683. line-height: 60rpx;
  684. margin-top: 20rpx;
  685. overflow: hidden;
  686. white-space: nowrap;
  687. text-overflow: ellipsis;
  688. }
  689. }
  690. .box_right{
  691. float: left;
  692. width: 485rpx;
  693. margin-left: 35rpx;
  694. padding-top: 20rpx;
  695. .coupon_title{
  696. width: 485rpx;
  697. max-height: 80rpx;
  698. font-size: 30rpx;
  699. overflow: hidden;
  700. line-height: 40rpx;
  701. padding: 0rpx 0rpx;
  702. .coupon_name{
  703. float: left;
  704. height: 40rpx;
  705. width: 380rpx;
  706. }
  707. .coupon_status{
  708. width: 85rpx;
  709. float: right;
  710. color: #999999;
  711. font-size: 24rpx;
  712. }
  713. }
  714. .product_scope{
  715. width: 485rpx;
  716. height: 80rpx;
  717. color: #999999;
  718. font-size: 24rpx;
  719. overflow: hidden;
  720. line-height: 80rpx;
  721. .check_label{
  722. float: right;
  723. display: block;
  724. overflow: hidden;
  725. padding: 20rpx 20rpx;
  726. .isstd{
  727. line-height: 40rpx;
  728. }
  729. .checkbox{
  730. float: right;
  731. width: 40rpx;
  732. height: 40rpx;
  733. }
  734. }
  735. }
  736. .coupon_info{
  737. width: 485rpx;
  738. max-height: 80rpx;
  739. font-size: 30rpx;
  740. overflow: hidden;
  741. line-height: 40rpx;
  742. padding: 0rpx 0rpx;
  743. .coupon_exp{
  744. float: left;
  745. font-size: 20rpx;
  746. }
  747. }
  748. }
  749. }
  750. .coupon_item:last-child{
  751. border-bottom: none;
  752. }
  753. }
  754. .addr_list{
  755. width: 730rpx;
  756. display: block;
  757. overflow: hidden;
  758. margin: 0rpx auto;
  759. min-height: 500rpx;
  760. .addr_item{
  761. display: block;
  762. font-size: 24rpx;
  763. overflow: hidden;
  764. line-height: 40rpx;
  765. padding: 15rpx 10rpx;
  766. border-radius: 15rpx;
  767. border-bottom: 2rpx solid #dddddd;
  768. .radio_label{
  769. width: 40rpx;
  770. float: left;
  771. height: 50rpx;
  772. padding-top: 30rpx;
  773. margin-right: 20rpx;
  774. .radio_icon{
  775. float: left;
  776. width: 40rpx;
  777. height: 40rpx;
  778. }
  779. }
  780. .contact_user{
  781. float: left;
  782. width: 640rpx;
  783. display: block;
  784. height: 50rpx;
  785. font-size: 24rpx;
  786. line-height: 50rpx;
  787. .contact_name{
  788. font-size: 26rpx;
  789. font-weight: bold;
  790. margin-right: 16rpx;
  791. }
  792. .contact_default{
  793. color: #F59A23;
  794. font-size: 20rpx;
  795. margin-left: 16rpx;
  796. border: 1rpx solid #F59A23;
  797. }
  798. .contact_shop{
  799. float: right;
  800. font-size: 26rpx;
  801. margin-right: 16rpx;
  802. }
  803. }
  804. .contact_addr{
  805. float: left;
  806. width: 640rpx;
  807. display: block;
  808. font-size: 24rpx;
  809. line-height: 30rpx;
  810. padding: 10rpx 5rpx;
  811. }
  812. }
  813. }
  814. .create_box{
  815. height: 140rpx;
  816. display: block;
  817. .create_addr{
  818. width: 700rpx;
  819. height: 80rpx;
  820. display: block;
  821. color: #FFFFFF;
  822. font-size: 30rpx;
  823. overflow: hidden;
  824. line-height: 80rpx;
  825. padding: 0rpx 0rpx;
  826. text-align: center;
  827. margin: 0rpx auto;
  828. margin-top: 20rpx;
  829. border-radius: 40rpx;
  830. background-color: #E03519;
  831. }
  832. }
  833. }
  834. </style>