confirmOrder.vue 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778
  1. <template>
  2. <view class="box">
  3. <view class="topTIs">门店确认收货后,您可去订单详情页选择预约时间</view>
  4. <view class="topShop">
  5. <view class="topShopName">{{orderShop.shopName}}</view>
  6. <view class="topShopAdress">
  7. <image src="../../static/img/topshopicon.png" mode="" class="topShopAdressIcon"></image>
  8. <view class="topShopjl" v-if="orderShop.distance">{{orderShop.distance}}km</view>
  9. <view class="topShopAdressTxt" v-if="orderShop.address">{{orderShop.address}}</view>
  10. </view>
  11. </view>
  12. <view class="topBox">
  13. <view class="top">
  14. <view class="topLine borderB" >
  15. <view class="toplineLeft">
  16. <view class="topTitle">车牌号:</view>
  17. <view class="topTxt">{{maintainCarData.plateNumber}}</view>
  18. </view>
  19. </view>
  20. <view class="topLine borderB" v-if="iphoneData">
  21. <view class="toplineLeft">
  22. <view class="topTitle">联系人:</view>
  23. <view class="topTxt">{{iphoneData.name}} {{iphoneData.phone}}</view>
  24. </view>
  25. <view class="topLineRight" @click="gophone">修改></view>
  26. </view>
  27. <view class="topLine borderB" v-if="!iphoneData" @click="gophone">
  28. <view class="toplineLeft">
  29. <view class="topTitle">联系人:</view>
  30. <view style="color: #999999; font-size: 28rpx;" >请选择</view>
  31. </view>
  32. <view style="width: 14rpx; height: 23rpx; color: #999999;">></view>
  33. </view>
  34. </view>
  35. </view>
  36. <!-- 保养信息 -->
  37. <view class="main">
  38. <view class="mainLine" v-for="(item,index) in orderData">
  39. <view class="mainTitle">{{item.name}}</view>
  40. <view class="goodsItem" v-for="(v,i) in item.listGoodsAll">
  41. <view>
  42. <image :src="v.picUrl" mode="" class="goodsImg" v-if="v.picUrl"></image>
  43. <image src="../../static/img/noimg.png" mode="" class="goodsImg" v-else></image>
  44. </view>
  45. <view class="goodsItemRight" >
  46. <view class="goodsItemName">{{v.goodsName}}</view>
  47. <view class="goodsItemBottom">
  48. <view class="goodssalePrice">¥{{v.salePrice?v.salePrice:'0.00'}}</view>
  49. <view class="goodsNum">x{{v.qty}}</view>
  50. </view>
  51. </view>
  52. </view>
  53. <view class="goodsItem" v-for="(v,i) in item.listItem">
  54. <view>
  55. <image :src="v.picUrl" mode="" class="goodsImg" v-if="v.picUrl"></image>
  56. <image src="../../static/img/noimg.png" mode="" class="goodsImg" v-else></image>
  57. </view>
  58. <view class="goodsItemRight" >
  59. <view class="goodsItemName">{{v.itemName}}</view>
  60. <view class="goodsItemBottom">
  61. <view class="goodssalePrice">¥{{v.salePrice?v.salePrice:'0.00'}}</view>
  62. </view>
  63. </view>
  64. </view>
  65. </view>
  66. </view>
  67. <!-- 订单备注-->
  68. <view class="remarksBox">
  69. <view class="remarksLeft">订单备注</view>
  70. <view>
  71. <textarea value="" placeholder="点击添加备注信息" class="textarea" v-model="remark"/>
  72. </view>
  73. </view>
  74. <!-- 支付方式 -->
  75. <view class="payBox">
  76. <view class="payLIne borderB">
  77. <view class="payTitle">支付方式</view>
  78. <view class="payTxt">在线支付</view>
  79. </view>
  80. <view class="payLIne borderB">
  81. <view class="payTitle">商品费</view>
  82. <view class="payTxt">¥{{goodsMoney.toFixed(2)}}</view>
  83. </view>
  84. <view class="payLIne borderB">
  85. <view class="payTitle">工时费</view>
  86. <view class="payTxt">¥{{itemMoney.toFixed(2)}}</view>
  87. </view>
  88. <view class="payLIne" @click="gocoupon">
  89. <view class="payTitle">优惠券</view>
  90. <view class="payTxt2" v-if="!couponMoney">{{yhTotalSize}}张可用></view>
  91. <view class="payTxt2" v-if="couponMoney">-¥{{couponMoney}}</view>
  92. </view>
  93. </view>
  94. <view style="height: 150rpx;"></view>
  95. <!-- 底部 -->
  96. <view class="bottom">
  97. <view class="bottomLeft">
  98. <view>
  99. <view class="heji"> <span class="heji1">合计</span> <span class="hejiNum">¥{{(goodsMoney+itemMoney-couponMoney).toFixed(2)}}</span> </view>
  100. <view class="hejiMs">共{{goodsCount}}件商品,{{itemCount}}项服务</view>
  101. </view>
  102. </view>
  103. <view class="settlement" @click="settlement">提交订单</view>
  104. </view>
  105. </view>
  106. </template>
  107. <script>
  108. export default {
  109. data() {
  110. return {
  111. remark:'',
  112. iphoneData:'',
  113. orderTime:'',
  114. OrderTimes:'',
  115. orderTimeIndex1:0,
  116. orderTimeIndex2:-1,
  117. timeShow:false,
  118. orderData:'',
  119. itemMoney:0,//项目总价
  120. goodsMoney:0,//商品总价
  121. goodsCount:0,//商品数
  122. itemCount:0,//项目数
  123. packJsonArr:[],
  124. shopData:'',
  125. maintainCarData:'',
  126. currentMileage:'',
  127. payMoney:'',
  128. couponID:'',
  129. couponMoney:'',
  130. yhTotalSize:0,
  131. orderShop:'',
  132. brands:'',
  133. }
  134. },
  135. onLoad(opt) {
  136. /* if(opt.type==2){
  137. this.shopData=uni.getStorageSync("cfshopInfo");
  138. }else{
  139. this.shopData=uni.getStorageSync("shopData");
  140. } */
  141. this.orderShop=uni.getStorageSync("orderShop")
  142. this.maintainCarData=uni.getStorageSync("maintainCarData");
  143. //this.getIphoneData(); 获取默认手机号
  144. console.log(opt.orderData)
  145. this.orderData=JSON.parse(opt.orderData);
  146. this.currentMileage=opt.currentMileage;
  147. console.log(this.orderData)
  148. this.orderData.forEach(item=>{
  149. var obj={
  150. 'packageID':item.id,
  151. 'itemJsonArr':[],
  152. 'goodsJsonArr':[],
  153. }
  154. if( item.listGoodsAll.length>0){
  155. item.listGoodsAll.forEach(v=>{
  156. this.goodsMoney+=v.salePrice*v.qty
  157. this.goodsCount+=v.qty
  158. var goodsObj={
  159. 'id':v.goodsID,
  160. //'mItemID':v.mItemID,
  161. 'mGoodsID':v.mGoodsID,
  162. 'salePrice':v.salePrice,
  163. 'saleQty':v.qty,
  164. 'amountMoney':v.salePrice*v.qty,
  165. }
  166. if(v.mItemID){
  167. goodsObj.mItemID=v.mItemID
  168. }
  169. obj.goodsJsonArr.push(goodsObj)
  170. })
  171. }
  172. if(item.listItem.length>0){
  173. item.listItem.forEach(v=>{
  174. this.itemMoney+=v.salePrice
  175. this.itemCount++;
  176. var itemObj={
  177. 'id':v.itemID,
  178. 'mItemID':v.mItemID,
  179. 'salePrice':v.salePrice,
  180. }
  181. obj.itemJsonArr.push(itemObj)
  182. })
  183. }
  184. this.packJsonArr.push(obj)
  185. })
  186. this.myOrderCoupon()// 优惠券
  187. console.log( this.packJsonArr)
  188. },
  189. onShow() {
  190. var iphoneData=uni.getStorageSync("phoneData");
  191. if(iphoneData){
  192. this.iphoneData=iphoneData
  193. }
  194. var couponData=uni.getStorageSync("couponData")
  195. if(couponData){
  196. this.couponID=couponData.ID;
  197. var ActMoney=couponData.ActMoney;
  198. var payMoney=this.goodsMoney+this.itemMoney;
  199. if(payMoney<ActMoney){
  200. this.couponMoney=payMoney
  201. }else{
  202. this.couponMoney=ActMoney
  203. }
  204. }
  205. var cardata = uni.getStorageSync("maintainCarData")
  206. this.maintainCarData=cardata
  207. },
  208. methods: {
  209. myOrderCoupon(){
  210. var payMoney=this.goodsMoney+this.itemMoney;
  211. //payMoney=40
  212. this.$http('worldKeepCar/maintainOrder/myOrderCoupon', {
  213. money:payMoney,
  214. shopId:this.orderShop.shopId,
  215. /* page:1,
  216. limit:2, */
  217. },'GET').then(res => {
  218. this.yhTotalSize=res.data.length
  219. })
  220. },
  221. gocoupon(){
  222. var payMoney=this.goodsMoney+this.itemMoney;
  223. //payMoney=40
  224. uni.navigateTo({
  225. url:'usableDiscountCard?payMoney='+payMoney+'&shopId='+this.orderShop.shopId
  226. })
  227. },
  228. settlement(){
  229. if(this.couponMoney){
  230. this.payMoney=this.goodsMoney+this.itemMoney-this.couponMoney;
  231. }else{
  232. this.payMoney=this.goodsMoney+this.itemMoney;
  233. }
  234. //this.payMoney=3;
  235. if(this.iphoneData){
  236. if(this.iphoneData.name==''){
  237. uni.showToast({
  238. title: '请选择联系人',
  239. icon:'none',
  240. duration: 2000
  241. });
  242. return false;
  243. }
  244. }else{
  245. uni.showToast({
  246. title: '请选择联系人',
  247. icon:'none',
  248. duration: 2000
  249. });
  250. return false;
  251. }
  252. /* var cardata={
  253. annualmoney: "2017",
  254. brand: "大众",
  255. brandLogo: "http://img.db.66km.cn/carbrandlogo/D - 大众.png",
  256. buyDate: "",
  257. carModel: "2018 双离合变速器(DSG) 7档 前置前驱 CC",
  258. carName: "",
  259. carNumber: "",
  260. createTime: "2021-10-27 09:20:29",
  261. dayMilage: 661,
  262. displacement: "1.4T",
  263. engineCode: "",
  264. engineType: "1111",
  265. id: "07EB4B07-5302-4574-9709-0EC0D1668155",
  266. insuranceCompany: "",
  267. insuranceExpireDate: "1900-01-01 00:00:00",
  268. insuredCity: "",
  269. isDefault: 0,
  270. istransfer: "",
  271. memberID: "E4416E30-C82A-4136-81B7-6B424DDE4847",
  272. milage: 7788,
  273. model: "C-TREK(蔚领)",
  274. nLevelID: "CFV0718D0038",
  275. plateNumber: "鲁A22333",
  276. saleName: "",
  277. series: "C-TREK(蔚领)",
  278. transmissionType: "自动",
  279. traveltime: "",
  280. vIN: "",
  281. currentMileage:'1111',
  282. } */
  283. uni.showLoading({ });
  284. this.$http('worldKeepCar/maintainOrder/submitOrder', {
  285. shopName:this.orderShop.shopName,
  286. contactName:this.iphoneData.name,
  287. contactPhone:this.iphoneData.phone,
  288. carID:this.maintainCarData.id,
  289. plateNumber:this.maintainCarData.plateNumber,
  290. carModel:this.maintainCarData.carModel,
  291. currentMileage:this.maintainCarData.milage,//this.currentMileage,
  292. comment:this.remark,
  293. itemMoney:this.itemMoney,
  294. goodsMoney:this.goodsMoney,
  295. goodsCount:this.goodsCount,
  296. itemCount:this.itemCount,
  297. couponMoney:this.couponMoney,
  298. couponID:this.couponID,
  299. payMoney:this.payMoney,
  300. //payMoney:0.01,
  301. packJsonArr:JSON.stringify(this.packJsonArr) ,
  302. shopID:this.orderShop.shopId,
  303. // unionID:this.orderShop.unionId,
  304. },'POST').then(res => {
  305. if(res.code==0){
  306. if(this.payMoney==0){
  307. uni.hideLoading();
  308. /* uni.navigateTo({
  309. url:'../order/orderDetail?id='+res.data.id+'&type=2'
  310. }) */
  311. this.orderPayzero(res.data.id)
  312. }else{
  313. this.orderPay(res.data.id)
  314. }
  315. }else{
  316. uni.hideLoading();
  317. uni.showToast({
  318. title: res.msg,
  319. icon:'none',
  320. duration: 4000
  321. });
  322. }
  323. })
  324. },
  325. orderPayzero(id){
  326. this.$http('worldKeepCar/maintainOrder/orderPay', {
  327. sheetID:id
  328. },'POST').then(res => {
  329. uni.hideLoading();
  330. if(res.code==0){
  331. }else{
  332. uni.hideLoading();
  333. uni.showToast({
  334. title: res.msg,
  335. icon:'none',
  336. duration: 4000
  337. });
  338. }
  339. if(res.isPay==0){
  340. uni.navigateTo({
  341. url:'../order/orderDetail?id='+id+'&type=2'
  342. })
  343. }
  344. })
  345. },
  346. orderPay(id){
  347. //uni.showLoading({ });
  348. this.$http('worldKeepCar/maintainOrder/orderPay', {
  349. sheetID:id
  350. },'POST').then(res => {
  351. uni.hideLoading();
  352. if(res.code==0){
  353. }else{
  354. uni.hideLoading();
  355. uni.showToast({
  356. title: res.msg,
  357. icon:'none',
  358. duration: 4000
  359. });
  360. }
  361. var payInfo=JSON.parse(res.data.payInfo)
  362. if(res.isPay==0){
  363. uni.navigateTo({
  364. url:'../order/orderDetail?id='+id+'&type=2'
  365. })
  366. }else{
  367. uni.requestPayment({
  368. provider: 'wxpay',
  369. // timeStamp: String(Date.now()),
  370. timeStamp:payInfo.timeStamp,
  371. nonceStr: payInfo.nonceStr,
  372. package: payInfo.package,
  373. signType: payInfo.signType,
  374. paySign: payInfo.paySign,
  375. success: function (res) {
  376. console.log('success:' + JSON.stringify(res));
  377. uni.showToast({
  378. title: '支付成功',
  379. icon:'none',
  380. duration: 2000
  381. });
  382. /* uni.switchTab({
  383. url:'../index/index'
  384. }) */
  385. uni.navigateTo({
  386. url:'../order/orderDetail?id='+id+'&type=2'
  387. })
  388. },
  389. fail: function (err) {
  390. console.log('取消支付fail:' + JSON.stringify(err));
  391. uni.navigateTo({
  392. url:'../order/orderDetail?id='+id+'&type=2'
  393. })
  394. }
  395. });
  396. }
  397. })
  398. },
  399. getIphoneData(){
  400. uni.showLoading({ });
  401. this.$http('miniAppMyBMemberCar/queryBMemberContactIsDefault', {
  402. },'GET').then(res => {
  403. uni.hideLoading();
  404. this.iphoneData=res.data;
  405. })
  406. },
  407. gophone(){
  408. uni.removeStorageSync('phoneData');
  409. uni.navigateTo({
  410. url:'../iPhone/phoneList'
  411. })
  412. },
  413. }
  414. }
  415. </script>
  416. <style scoped>
  417. .topTIs{
  418. font-size: 26rpx;
  419. text-align: center;
  420. color: #C8841C;
  421. height: 72rpx;
  422. background: #FFF7EB;
  423. line-height: 72rpx;
  424. margin-bottom: 20rpx;
  425. }
  426. .topShopAdressIcon{
  427. width: 22rpx;
  428. height: 29rpx;
  429. }
  430. .topShop{
  431. width: 702rpx;
  432. min-height: 148rpx;
  433. background: #FFFFFF;
  434. border-radius: 10rpx;
  435. margin: 0 auto;
  436. }
  437. .topShopName{
  438. font-size: 28rpx;
  439. padding-top: 30rpx;
  440. padding-left: 20rpx;
  441. color: #3C3C3C;
  442. }
  443. .topShopAdress{
  444. display: flex;
  445. padding: 20rpx;
  446. }
  447. .topShopjl{
  448. font-size: 24rpx;
  449. line-height: 30rpx;
  450. color: #999999;
  451. padding-left: 16rpx;
  452. }
  453. .topShopAdressTxt{
  454. font-size: 24rpx;
  455. line-height: 30rpx;
  456. color: #999999;
  457. padding-left: 16rpx;
  458. }
  459. .box{
  460. min-height: 100vh;
  461. background:#F4F5F7 ;
  462. }
  463. .timeBox{
  464. width: 100vw;
  465. height: 100vh;
  466. background: rgba(0,0,0,0.5);
  467. position: fixed;
  468. top: 0;
  469. left: 0;
  470. z-index: 111;
  471. }
  472. .timeLeftActive{
  473. background: #FFFFFF;
  474. }
  475. .timeMain{
  476. width: 100vw;
  477. height: 70vh;
  478. margin-top: 30vh;
  479. background: #FFFFFF;
  480. border-radius: 24rpx 24rpx 0px 0px;
  481. }
  482. .timesfNo{
  483. background: #F5F5F5;
  484. }
  485. .timesfActive{
  486. background: #FF4F00;
  487. }
  488. .timesfActive .timeSfNum{
  489. color: #FFFFFF;
  490. }
  491. .timesfActive .timeyy{
  492. color: #FFFFFF;
  493. }
  494. .topBox{
  495. padding: 20rpx 24rpx;
  496. }
  497. .timeTop{
  498. display: flex;
  499. line-height: 90rpx;
  500. padding-left: 24rpx;
  501. padding-right: 24rpx;
  502. justify-content: space-between;
  503. }
  504. .timeTopTitle{
  505. font-size: 30rpx;
  506. font-family: PingFangSC-Medium, PingFang SC;
  507. font-weight: 600;
  508. color: #3C3C3C;
  509. }
  510. .close{
  511. color: #999999;font-size: 30rpx;
  512. padding-left: 30rpx;
  513. }
  514. .timeCont{
  515. height: calc(70vh - 210rpx);
  516. }
  517. .timeSv{
  518. height: calc(70vh - 210rpx);
  519. }
  520. .timeLeft{
  521. width: 162rpx;
  522. background: #F4F5F7;
  523. border-top: 1px soid #F4F5F7;
  524. border-right:1px soid #F4F5F7 ;
  525. }
  526. .timeRight{
  527. width: 588rpx;
  528. }
  529. .timesf{
  530. width: 165rpx;
  531. height: 98rpx;
  532. border-radius: 7rpx;
  533. border: 2rpx solid #EEEEEE;
  534. text-align: center;
  535. margin-left: 20rpx;
  536. margin-bottom: 24rpx;
  537. }
  538. .timeBottom{
  539. width: 750rpx;
  540. height: 120rpx;
  541. background: #FFFFFF;
  542. box-shadow: 0px -2px 20rpx 0px rgba(153, 153, 153, 0.2);
  543. display: flex;
  544. align-items: center;
  545. }
  546. .timerightBox{
  547. display: flex;
  548. flex-wrap: wrap;
  549. }
  550. .timeCont{
  551. display: flex;
  552. }
  553. .timeSfNum{
  554. color: #666666;
  555. font-size: 28rpx;
  556. padding-top: 15rpx;
  557. }
  558. .timeyy{
  559. font-size: 24rpx;
  560. color: #999999;
  561. }
  562. .timecomplete{
  563. width: 690rpx;
  564. height: 74rpx;
  565. background: linear-gradient(124deg, #FF8700 0%, #FF4F00 100%);
  566. border-radius: 37rpx;
  567. line-height: 74rpx;
  568. text-align: center;
  569. font-size: 30rpx;
  570. color: #FFFFFF;
  571. margin-left: 30rpx;
  572. }
  573. .timeleftLine{
  574. font-size: 30rpx;
  575. color: #999999;
  576. text-align: center;
  577. padding: 28rpx 10rpx;
  578. border-bottom: 1px solid #EEEEEE;
  579. }
  580. .top{
  581. background: #FFFFFF;
  582. border-radius: 10px;
  583. padding: 0 20rpx;
  584. }
  585. .topLine{
  586. display: flex;
  587. justify-content: space-between;
  588. padding: 30rpx 0;
  589. }
  590. .toplineLeft{
  591. display: flex;font-size: 28rpx;
  592. }
  593. .topTitle{
  594. width: 150rpx;font-weight: 400;
  595. color: #3C3C3C;
  596. }
  597. .topLineRight{
  598. font-size: 26rpx;
  599. font-family: PingFangSC-Regular, PingFang SC;
  600. font-weight: 400;
  601. color: #FF4F00;
  602. }
  603. .topTxt{
  604. color: #3C3C3C;
  605. }
  606. .borderB{
  607. border-bottom: 1px solid #EEEEEE;
  608. }
  609. .goodsImg{
  610. width: 120rpx;height: 120rpx;
  611. }
  612. .main{
  613. padding: 0 24rpx;
  614. }
  615. .mainLine{
  616. background: #FFFFFF;
  617. padding: 24rpx 20rpx;
  618. border-radius: 10rpx;
  619. }
  620. .mainTitle{
  621. font-size: 28rpx;
  622. font-weight: 600;
  623. color: #3C3C3C;
  624. }
  625. .goodsItem{
  626. display: flex;
  627. padding: 15rpx 0;
  628. }
  629. .goodsItemRight{
  630. width: 520rpx;
  631. padding-left: 20rpx;
  632. display: flex;
  633. flex-direction:column;
  634. justify-content: space-between;
  635. }
  636. .goodsItemBottom{
  637. display: flex;
  638. justify-content: space-between;
  639. }
  640. .goodsItemName{
  641. font-size: 26rpx;
  642. color: #3C3C3C;
  643. }
  644. .goodssalePrice{
  645. font-size: 32rpx;font-weight: 500;color: #FF4F00;
  646. }
  647. .goodsNum{
  648. font-size: 24rpx;font-weight: 400;color: #999999;
  649. }
  650. .remarksBox{
  651. display: flex;
  652. padding: 24rpx;
  653. border-radius: 16rpx;
  654. background: #FFFFFF;
  655. margin-top: 20rpx;
  656. width: 654rpx;
  657. margin-left: 24rpx;
  658. }
  659. .remarksLeft{
  660. color: #333333;font-size: 28rpx;
  661. width: 160rpx;
  662. }
  663. .textarea{
  664. width: 500rpx;
  665. font-size: 26rpx;
  666. height: 100rpx;
  667. padding: 0;
  668. padding-left: 30rpx;
  669. }
  670. .payBox{
  671. background: #FFFFFF;
  672. margin-top: 20rpx;
  673. margin-left: 24rpx;
  674. width: 702rpx;
  675. border-radius: 16rpx;
  676. }
  677. .payLIne{
  678. display: flex;
  679. justify-content: space-between;
  680. color: #3C3C3C;
  681. font-size: 28rpx;
  682. padding: 29rpx 20rpx;
  683. }
  684. .payTxt2{
  685. color: #FF4F00;
  686. }
  687. .bottom{
  688. position: fixed;
  689. left: 0;
  690. bottom: 0;
  691. width: 100vw;
  692. height: 120rpx;
  693. background: #FFFFFF;
  694. box-shadow: 0px -2px 20px 0px rgba(153, 153, 153, 0.2);
  695. display: flex;
  696. justify-content: space-between;
  697. }
  698. .bottomLeft{
  699. display: flex;
  700. padding-left: 20rpx;
  701. }
  702. .heji1{
  703. font-size: 24rpx;
  704. font-weight: 500;
  705. color: #666666;
  706. }
  707. .hejiNum{
  708. font-size: 32rpx;
  709. font-family: PingFangSC-Medium, PingFang SC;
  710. font-weight: 500;
  711. color: #FF4F00;
  712. }
  713. .hejiMs{
  714. font-size: 24rpx;
  715. padding-top: 5rpx;
  716. color: #999999;
  717. }
  718. .heji{
  719. padding-top: 23rpx;
  720. }
  721. .settlement{
  722. width: 203rpx;
  723. height: 74rpx;
  724. background: #FF4F00;
  725. border-radius: 37rpx;
  726. text-align: center;
  727. line-height: 74rpx;
  728. font-size: 30rpx;
  729. font-family: PingFangSC-Medium, PingFang SC;
  730. font-weight: 500;
  731. color: #FEFFFE;
  732. margin-top: 23rpx;
  733. margin-right: 32rpx;
  734. }
  735. </style>