orderDet.css 8.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. /* pages/orderDet/orderDet.wxss */
  2. /* 门店自提 */
  3. .tihuo{height: 140rpx;align-items: center;justify-content: space-between;margin: 20rpx;padding: 0 20rpx;}
  4. .tihuoma{align-items: center;font-size: 30rpx;color: #333;font-weight: bold;}
  5. .tihuoma text{color: #FE0419;}
  6. .tihuoma image{width: 33rpx;height: 36rpx;margin-right: 20rpx;}
  7. .thmbtn{text-align: center;font-size: 22rpx;color: #999;}
  8. .thmbtn image{width: 54rpx;height: 54rpx;margin: 0 auto 5rpx;}
  9. .mdaddr{position: relative;margin: 20rpx;}
  10. .mdaddr1{position: relative;margin:20rpx 20rpx 0rpx 20rpx}
  11. .mdinfo{padding: 25rpx 20rpx;}
  12. .dwico{width: 28rpx;height: 34rpx;position: absolute;top: 50%;transform: translateY(-50%);right: 0;}
  13. .mdinfo .areas{margin-bottom: 20rpx;}
  14. .mdinfo text{display: block;font-size: 24rpx;color: #999;line-height: 36rpx;}
  15. .mdphone{padding: 30rpx 20rpx 35rpx;position: relative;font-size: 30rpx;color: #333;border-top: 2rpx solid #E5E5E5;}
  16. .mdphone text{color: #FE0419;}
  17. .mdphone image{width: 36rpx;height: 39rpx;position: absolute;top: 50%;transform: translateY(-50%);right: 20rpx;}
  18. /* 物流配送 */
  19. .top,.examine,.gomen{background: #fff;margin: 20rpx;border-radius: 10rpx;}
  20. .status{display: flex;display: -webkit-flex;justify-content: center;font-size: 24rpx;color: #999;padding: 53rpx 0 20rpx;border-bottom: 1rpx solid #E5E5E5;}
  21. .status .li{width: 25%;position: relative;text-align: center;}
  22. .status .li::after{content: '';display: block;height: 4rpx;background: #CCD0D9;position: absolute;top: 8rpx;left: -50%;right: 50%;z-index: 1;}
  23. .status .li:first-child::after{display: none;}
  24. .status text{display: block;width: 20rpx;height: 20rpx;border-radius: 50%;background: #CCD0D9;margin: 0 auto 25rpx;position: relative;z-index: 2;}
  25. .status .li.ing{color: #FE0419;}
  26. .status .li.ing::after{background: #FE0419;}
  27. .status .li.ing text{background: #FE0419;}
  28. .addr{padding: 25rpx 20rpx 35rpx;border-radius: 10rpx;position: relative;overflow: hidden;}
  29. .addr view{font-size: 24rpx;color: #999;position: relative;margin: 20rpx 0 0;}
  30. .addr view text{margin-left: 20rpx;}
  31. .areas{display: block;font-size: 30rpx;color: #333;font-weight: bold;line-height: 36rpx;align-items: center;position: relative;}
  32. .dzbg{display: block;position: absolute;bottom: 0;left: 0;right: 0;width: 100%;height: 8rpx;}
  33. .psfs{background: #fff;padding: 25rpx 45rpx 25rpx 20rpx;margin: 20rpx;overflow: hidden;position: relative;}
  34. .psico{width: 41rpx;height: 31rpx;margin-right: 22rpx;margin-top: 5rpx;}
  35. .psfs .flex view{font-size: 28rpx;color: #0065AC;margin-bottom: 12rpx;line-height: 40rpx;}
  36. .psfs .flex text{display: block;font-size: 24rpx;color: #666;}
  37. .rico1{width: 14rpx;height: 26rpx;position: absolute;top: 50%;right: 20rpx;transform: translateY(-50%);}
  38. .list{margin: 0 20rpx;background: #fff;border-radius: 10rpx;margin-bottom: 20rpx;}
  39. .dpname{display: flex;display: -webkit-flex;align-items: center;font-size: 26rpx;color: #333;padding: 25rpx 20rpx;border-bottom: 2rpx solid #eee;}
  40. .l-s-img{width: 32rpx;height: 27rpx;margin-right: 15rpx;}
  41. .dd-sta{font-size: 24rpx;color: #999; align-items: center;}
  42. .dd-stared{font-size: 24rpx;color: #FE0419; align-items: center;}
  43. .rico {
  44. display: block;
  45. width: 14rpx;
  46. height: 21rpx;
  47. margin-left: 12rpx;
  48. }
  49. .list .li{margin: 0 20rpx;border-bottom: 2rpx solid #eee;padding: 39rpx 0;}
  50. .list .li:last-child{border-bottom: none;}
  51. .li-info{align-items: center;}
  52. .cimgs{position: relative;width: 180rpx;height: 180rpx;box-sizing: border-box;border: 2rpx solid #E5E5E5;border-radius: 10rpx;margin-right: 20rpx;}
  53. .type{width: 82rpx;height: 36rpx;position: absolute;top: 10rpx;left: 10rpx;}
  54. .cimg{width: 100%;height: 100%;}
  55. .zhinfo{flex:1;-webkit-flex: 1;overflow: hidden;position: relative;}
  56. .list .li:last-child .zhinfo{border-bottom: none;}
  57. .zhtit{font-size: 30rpx;color: #333;/* white-space: nowrap;text-overflow: ellipsis; */overflow: hidden;line-height: 36rpx;height: 72rpx;}
  58. .guigecontent{
  59. margin-top: 5rpx;
  60. font-size: 22rpx;color: #999;
  61. display: flex;
  62. flex-direction: row;
  63. }
  64. .guige{font-size: 22rpx;color: #999;}
  65. .jiage{display: flex;display: -webkit-flex;align-items: center;justify-content: space-between;margin-top: 30rpx;}
  66. .zhjia{font-size: 30rpx;color: #FE0419;}
  67. .zhjia text{font-size: 24rpx;}
  68. .zhjia text.del{color: #999;margin-left: 10rpx;text-decoration: line-through;}
  69. .num{font-size: 28rpx;color: #333;}
  70. .num text{font-size: 24rpx;}
  71. .list .lis{align-items: center;font-size: 26rpx;color: #999;padding: 10rpx 20rpx;margin-top: 10rpx;}
  72. .wuliu{background:#fffaf7;}
  73. .y-txt{color:#f65304;}
  74. .r-txt{color:#FE0419;}
  75. .zhuang{background:rgba(253, 61, 50, .05)}
  76. .lis-img{width: 41rpx;height: 31rpx;margin-right: 20rpx;}
  77. .ddinfo{background: #fff;padding: 0 20rpx;margin: 20rpx;border-radius: 10rpx;}
  78. .ddinfo .li{display: flex;display: -webkit-flex;align-items: center;padding: 30rpx 0;border-bottom: 1rpx solid #EEEEEE;}
  79. .ddinfo .li:last-child{border-bottom: none;}
  80. .ddinfo .li text{display: block;font-size: 28rpx;color: #999;}
  81. .ddinfo .li view{flex: 1;-webkit-flex: 1;font-size: 28rpx;color: #333;text-align: right;}
  82. .ddinfo .li view.price{color: #FE0419;}
  83. .ddid{justify-content: flex-end;}
  84. .ddinfo .li text.copy{border: 1rpx solid #999;border-radius: 20rpx;padding: 0 15rpx;height: 36rpx;line-height: 36rpx;margin-left: 15rpx;font-size: 24rpx;}
  85. .bot{position: fixed;left: 0;right: 0;bottom: 0;background: #fff;display: flex;display: -webkit-flex;justify-content: flex-end;align-items: center;height: 60rpx;padding: 20rpx;}
  86. .bot-view{width: 178rpx !important;height: 56rpx;border: 2rpx solid #666666;border-radius: 48rpx !important;text-align: center;line-height: 56rpx !important;font-size: 28rpx;color: #666666;margin-left: 10rpx !important;}
  87. .confirm{color: #fff;border-color: #FE0419;background: #FE0419;}
  88. /* 自提取货码 */
  89. .qhpop{position: fixed;z-index: 100;background: #fff;border-radius: 10rpx;left: 80rpx;right: 80rpx;top: 50%;transform: translateY(-50%);padding: 65rpx 65rpx 95rpx;text-align: center;}
  90. .close{position: absolute;top: 20rpx;right: 20rpx;}
  91. .close image{width: 30rpx;height: 30rpx;}
  92. .thma{font-size: 40rpx;color: #333;font-weight: bold;}
  93. .thma text{display: block;font-size: 36rpx;color: #FE0419;margin-top: 15rpx;}
  94. .qrcode{margin: 75rpx 0 100rpx;display: flex;justify-content: center;}
  95. .qrcode image{width: 330rpx;height: 330rpx;margin: 0 auto;}
  96. .save{height: 80rpx;line-height: 80rpx;border-radius: 40rpx;font-size: 36rpx;color: #fff;background: #FE0419;}
  97. .canvas {
  98. position: fixed;
  99. left: 9000px;
  100. }
  101. .examine .cont{padding: 40rpx 29rpx; justify-content: space-between; align-items: center;}
  102. .examine image{width:55rpx ;height: 50rpx;}
  103. .mendian{padding: 25rpx 20rpx 35rpx;border-radius: 10rpx;}
  104. .mendian .cont{font-size: 28rpx;color: #0065AC;align-items:center ;justify-content: space-between;}
  105. .mendian image{width: 39rpx;height: 29rpx; float: left;margin-top: 6rpx;}
  106. .mendian .cont .right image{width: 12rpx;height: 22rpx;}
  107. /* 配送员信息 */
  108. .psy{background: #fff;margin: 0 20rpx 20rpx;border-radius: 10rpx;height: 86rpx;font-size: 28rpx;color: #333;padding: 0 20rpx;align-items: center;}
  109. .psy-info{align-items: center;justify-content: flex-end;}
  110. .psy-phone{color: #0367AD;align-items: center;}
  111. .psy-phone image{width: 32rpx;height: 32rpx;margin-right: 12rpx;}
  112. .psy-name{color: #666;margin-left: 19rpx;padding-left: 24rpx;border-left: 1rpx solid #B5B5B5;}
  113. /* 申请售后 */
  114. .ceng{position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,.5);z-index: 99;}
  115. .popup{position: fixed;top: 50%;left: 80rpx;right: 80rpx;transform: translateY(-50%);background: #fff;border-radius: 15rpx;text-align: center;padding: 60rpx 0 0;z-index: 100;}
  116. .pop-tit{font-size: 38rpx;color: #333;margin-bottom: 40rpx;}
  117. .pop-tip{font-size: 30rpx;color: #666;padding: 0 60rpx 60rpx;line-height: 40rpx;}
  118. .pop-btn{border-top: 1rpx solid #E5E5E5;justify-content: space-between;}
  119. .pop-btn .fflex{flex: 0.5;}
  120. .pop-cancel{width: 50% !important;height: 90rpx;font-size: 30rpx;text-align: center;line-height: 90rpx !important;box-sizing: border-box;}
  121. .pop-contact{height: 90rpx;font-size: 30rpx;text-align: center;line-height: 90rpx !important;box-sizing: border-box;}
  122. .pop-cancel{color: #999;}
  123. .pop-contact{color: var(--mina);border-left: 1rpx solid #e5e5e5;}