orderStatus.vue 37 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077
  1. <template>
  2. <view class="container-view">
  3. <view class="time-info">
  4. <navBar bgColor="transparent" left="0"></navBar>
  5. <view>
  6. <view v-if="orderInfo.pay_status!=2">
  7. <view class="get-time-view flex-row" v-if="orderInfo.pay_status == 0">待支付</view>
  8. <view class="get-time-view flex-row" v-else-if="orderInfo.pay_status == 1">支付中</view>
  9. <view class="get-time-view flex-row" v-else-if="orderInfo.pay_status == 3">支付失败</view>
  10. <view class="get-time-view flex-row" v-else-if="orderInfo.pay_status == 4">支付取消</view>
  11. <view class="get-time-view flex-row" v-else-if="orderInfo.pay_status == 5">线下待审核</view>
  12. <view class="get-time-view flex-row" v-else-if="orderInfo.pay_status == 6">线下审核拒绝</view>
  13. </view>
  14. <block v-if="orderInfo.pay_status == 2">
  15. <view :class="['get-time-view', 'flex-row', 'blue-text']" v-if="orderInfo.order_status == 3">使用中...
  16. </view>
  17. <view :class="['get-time-view', 'flex-row', 'red-text']" v-if="orderInfo.order_status == 4">已逾期
  18. </view>
  19. <view class="get-time-view flex-row" v-if="orderInfo.order_status == 2">请上传车辆图片激活车辆</view>
  20. <view class="get-time-view flex-row" v-if="orderInfo.order_status == 5">待门店确认</view>
  21. <view class="get-time-view flex-row" v-if="orderInfo.order_status == 6">还车中,等待门店取车</view>
  22. <view class="get-time-view flex-row" v-if="orderInfo.order_status == 7">已完成</view>
  23. <view class="get-time-view flex-row"
  24. v-if="orderInfo.order_status == 8||orderInfo.order_status == 9">已取消</view>
  25. <view class="get-time-view flex-row" v-if="orderInfo.order_status == 1 "><text>请于</text><text
  26. class="get-car-time">{{tools.formatTimeSecond( orderInfo.pick_up_time)}}</text><text>到门店取车</text>
  27. </view>
  28. <view v-if="orderInfo.order_status == 10">已完结</view>
  29. </block>
  30. </view>
  31. <view class="time-money">
  32. <view v-if="orderInfo.order_type != 3" class="flex-row flex-between">
  33. <view class="money-item">
  34. <view :class="orderInfo.order_status == 4?'red-status':''">
  35. <block v-if="orderInfo.hire_duration_time">{{orderInfo.hire_duration_time}}</block>
  36. <block v-else>{{Number(orderInfo.hire_cycle) * (orderInfo.hire_duration)}}</block>
  37. </view>
  38. <view>{{((orderInfo.order_status == 2) || orderInfo.order_status == 3)?'租期剩余':(orderInfo.order_status == 4 ? '逾期时长':'租借周期')}}·<text style="opacity: 0.4;">{{leaseUnits(orderInfo.hire_duration_unit)}}</text></view>
  39. <!-- <view v-if="(orderInfo.order_status == 2&&orderInfo.hire_type==2) || orderInfo.order_status == 3">
  40. 租期剩余·天</view>
  41. <view v-else-if="orderInfo.order_status == 4 " class="red-status">逾期时长·天</view>
  42. <view v-else>租借周期·天</view> -->
  43. </view>
  44. <view v-if="orderInfo.order_status != 4" class="money-item">
  45. <view>
  46. {{tools.toFix(orderInfo.hire_money / 100)}}
  47. </view>
  48. <view>订单金额<text style="opacity: 0.4;">·$</text></view>
  49. </view>
  50. <view v-if="orderInfo.order_status == 4" class="money-item">
  51. <view style="color:#F95151" class="red-status">
  52. {{tools.toFix(overdueData.money / 100)}}
  53. </view>
  54. <view style="color:#F95151">逾期金额·$</view>
  55. </view>
  56. <view @tap="bindExpanded">
  57. <text>{{isExpanded?'收起':'展开'}}</text>
  58. <img
  59. :src="isExpanded?'https://qiniu.bms16.com/FvRah8ro91B_TUVEmInBq6n69W2f':'https://qiniu.bms16.com/FtbxPP0aXYG8hyJTEJfNTXa_Puuc'" />
  60. </view>
  61. </view>
  62. <view v-if="orderInfo.order_type == 3" class="flex-row flex-between">
  63. <view class="money-item">
  64. <view></view>
  65. <view>租借周期:购买</view>
  66. </view>
  67. <view class="money-item">
  68. <view :class="orderInfo.order_status == 4?'red-status':''">
  69. {{orderInfo.order_status == 4?tools.toFix(over_fee/100):tools.toFix(orderInfo.money / 100)}}<text>元</text>
  70. </view>
  71. <view>订单金额</view>
  72. </view>
  73. <view @tap="bindExpanded">
  74. <text>{{isExpanded?'收起':'展开'}}</text>
  75. <img
  76. :src="isExpanded?'https://qiniu.bms16.com/FvRah8ro91B_TUVEmInBq6n69W2f':'https://qiniu.bms16.com/FtbxPP0aXYG8hyJTEJfNTXa_Puuc'" />
  77. </view>
  78. </view>
  79. <view v-if="isExpanded" class="dashed-border"></view>
  80. <view v-if="isExpanded">
  81. <view class="big-text">订单信息</view>
  82. <view class="sn-content flex-row flex-between">
  83. <view class="sn-title">订单编号</view>
  84. <view class="sn-text">{{orderInfo.sub_sn}}</view>
  85. </view>
  86. <view class="sn-content flex-row flex-between">
  87. <view class="sn-title">下单时间</view>
  88. <view class="sn-text">{{tools.formatTime(orderInfo.ctime)}}</view>
  89. </view>
  90. <view v-if="orderInfo.pay_time" class="sn-content flex-row flex-between">
  91. <view class="sn-title">支付时间</view>
  92. <view class="sn-text">{{tools.formatTime(orderInfo.pay_time)}}</view>
  93. </view>
  94. <view class="sn-content flex-row flex-between">
  95. <view class="sn-title">支付方式</view>
  96. <view v-if="orderInfo.pay_type == 0" class="sn-text">微信支付</view>
  97. <view v-if="orderInfo.pay_type == 1" class="sn-text">线下支付</view>
  98. <view v-if="orderInfo.pay_type == 2" class="sn-text">支付宝支付</view>
  99. <view v-if="orderInfo.pay_type == 9" class="sn-text">钱包余额支付</view>
  100. </view>
  101. <view v-if="orderInfo.order_type != 3" class="sn-content flex-row flex-between">
  102. <view class="sn-title">租车金额</view>
  103. <view class="sn-text">$ {{tools.toFix(orderInfo.hire_money/1000)}}</view>
  104. </view>
  105. <view v-if="orderInfo.order_type != 3" class="sn-content flex-row flex-between">
  106. <view class="sn-title">租车押金</view>
  107. <view class="sn-text"><text class="grey-text"></text> $
  108. {{tools.toFix(orderInfo.deposit/1000)}}
  109. </view>
  110. </view>
  111. </view>
  112. </view>
  113. </view>
  114. <view class="car-info">
  115. <view class="flex-row flex-between" style="margin-bottom: 40rpx;">
  116. <text>自行去门店取还</text>
  117. <text class="distance-num">{{orderInfo.distance}}m</text>
  118. </view>
  119. <view class="flex-row store-img-view">
  120. <img src="https://qiniu.bms16.com/FrwDlFZdSMiBgqnqDjB19PiDUmuu" alt="">
  121. <view style="width: calc(100% - 180rpx);margin-left: 24rpx;">
  122. <view class="store-name">{{orderInfo.shop_name}}</view>
  123. <view class="store-name-address">{{orderInfo.address || '未知地址'}}</view>
  124. <view class="flex-row flex-between align-center">
  125. <view class="flex-row time-style align-center">
  126. <img v-if="orderInfo.work_begin_time && orderInfo.work_end_time"
  127. style="width: 40rpx;height: 40rpx;"
  128. src="https://qiniu.bms16.com/Fp-G1pdXxnTV-G3qFbgS453AuqcU" alt="">
  129. <text
  130. v-if="orderInfo.work_begin_time && orderInfo.work_end_time">{{orderInfo.work_begin_time}}-{{orderInfo.work_end_time}}</text>
  131. </view>
  132. <img @click="navToCabinet" style="width: 112rpx;height: 64rpx;"
  133. src="https://qiniu.bms16.com/Fts38M35doVjK09GfOza5qD-wwkK" alt="">
  134. </view>
  135. </view>
  136. </view>
  137. </view>
  138. <view class="car-info">
  139. <view>车辆信息</view>
  140. <view class="car-top flex-row flex-between">
  141. <view>
  142. <view class="top-flex">
  143. <view>{{orderInfo.model_name}}</view>
  144. <view>
  145. 续航{{(orderInfo.endurance /1000).toFixed(0)}}km|重量{{(orderInfo.weight / 1000).toFixed(0)}}kg
  146. </view>
  147. </view>
  148. <!-- //配套服务 -->
  149. <view class="serviceList">
  150. <view v-for="(item,index) of orderInfo.service_list" :key="index" class="tag">
  151. {{item}}
  152. </view>
  153. </view>
  154. </view>
  155. <image mode="aspectFill" v-if="orderInfo.model_images" :src="orderInfo.model_images"></image>
  156. <image v-else src="https://qiniu.bms16.com/FhEvnKUckAHPtWaC04mi2s53IEVj" mode=""></image>
  157. </view>
  158. <!-- <view class="exchange-info">
  159. <view class="flex-row flex-between">
  160. <view class="exchange-info-title flex-row align-center">
  161. <img style="width: 40rpx;height: 40rpx;" src="https://qiniu.bms16.com/Fj_ifr41AqH2PijZBdOBa3SCxADg" alt="">
  162. <text style="margin-left: 16rpx;">换电信息</text>
  163. </view>
  164. <view @tap="navToExchange" class="flex-row" style="margin-bottom: 28rpx;">
  165. <view class="exchange-button">共3次</view>
  166. <image src="https://qiniu.bms16.com/FpIN7AVzFU75slFlX-SIdnSEmn1k" style="width: 28rpx;height: 28rpx;" />
  167. </view>
  168. </view>
  169. <view class="exchange-content">本单可享3次免费换电数,超出后需单独支付</view>
  170. <view class="exchange-content">自费换电:S1/次</view> -->
  171. <!-- <view class="exchange-content">本单您可享受{{orderInfo.gift_exchange_num}}次免费换电,
  172. 当前免费换电剩余{{(orderInfo.gift_exchange_num - orderInfo.used_exchange_num) > 0 ? (orderInfo.gift_exchange_num - orderInfo.used_exchange_num) : '0' }}次,超出后需要单独支付换电费用
  173. </view> -->
  174. <!-- </view> -->
  175. </view>
  176. <view v-if="orderInfo.hire_begin_time!=0&&orderInfo.hire_end_time!=0" class="return-info">
  177. <view class="return-top flex-row flex-between">
  178. <view>取还时间</view>
  179. <view>
  180. <!-- 共3天{{orderInfo.hire_return_time.day > 0 ? orderInfo.hire_return_time.day :'' }}<text
  181. v-if="orderInfo.hire_return_time.day>0">日</text>{{orderInfo.hire_return_time.hour > 0 ? orderInfo.hire_return_time.hour :'' }}<text
  182. v-if="orderInfo.hire_return_time.hour>0">小时</text>{{orderInfo.hire_return_time.minute > 0 ? orderInfo.hire_return_time.minute :'' }}<text
  183. v-if="orderInfo.hire_return_time.minute>0">分</text> -->
  184. 共{{hireDurationUnitsFn(orderInfo.total_hire_time,orderInfo.hire_duration_unit)}}
  185. </view>
  186. </view>
  187. <view class="return-bottom flex-row">
  188. <view>{{orderInfo.hire_begin_times}}</view>
  189. <img src="https://qiniu.bms16.com/FoXmBbj7YGWmjyeuVEY35nzieqnx" />
  190. <view>{{orderInfo.hire_end_times}}</view>
  191. <!-- <view>{{tools.formatTimeDate(orderInfo.hire_begin_time)}}</view>
  192. <img src="https://qiniu.bms16.com/FoXmBbj7YGWmjyeuVEY35nzieqnx" />
  193. <view>{{tools.formatTimeDate(orderInfo.hire_end_time)}}</view> -->
  194. </view>
  195. </view>
  196. <view v-if="orderInfo.order_status==2||orderInfo.order_status==3||orderInfo.order_status==4"
  197. class="overdue-info">
  198. <view>逾期规则</view>
  199. <view class="overdue-one">
  200. <view>1. 逾期后还可用车吗?</view>
  201. <view>如果逾期将触发智能锁车逻辑,可能导致您无法正常用车,请及时续费或联系商家处理。</view>
  202. </view>
  203. <view class="overdue-two">
  204. <view>2. 逾期费计算标准是什么?</view>
  205. <view>小时租逾期费=每小时费用*逾期小时;当日还/日/周/月/季租逾期费=每天费用*逾期天数;如果不满1小时按1小时算,不满1天按1天算,最终收取的逾期费以门店确认的费用为准</view>
  206. </view>
  207. <view class="overdue-thr">
  208. <view>3. 逾期后续租如何收费?</view>
  209. <view>逾期后及时续租不收取逾期费,逾期时长将从续租订单的用车时间中抵扣</view>
  210. </view>
  211. </view>
  212. <view class="inset-bottom"></view>
  213. <view class="payment-info flex-row flex-between">
  214. <view>
  215. <view
  216. v-if="(orderInfo.order_status == 0 ||orderInfo.order_status == 1 || orderInfo.pay_status == 5 || orderInfo.pay_status == 0) && orderInfo.order_type != 3"
  217. class="cancel" @tap="clickCancel">结束订单</view>
  218. </view>
  219. <view class="flex-row">
  220. <view v-if="orderInfo.order_status == 1" @tap="navToScan" class="sesame-btn ">扫码绑定</view>
  221. <view v-if="orderInfo.order_status == 2" @tap="navToScan" class="sesame-btn ">去上传</view>
  222. <view
  223. v-if="(orderInfo.order_status == 3||orderInfo.order_status == 4) && orderInfo.order_type != 3 && orderInfo.pay_status != 5"
  224. @tap="tapReturnCar" class="deposit-btn">到店还车</view>
  225. <view
  226. v-if="(orderInfo.order_status == 3||orderInfo.order_status == 4) && orderInfo.order_type != 3 && orderInfo.pay_status != 5"
  227. @tap="bindRenew" class="sesame-btn">续租</view>
  228. <view @tap="callStorePhone" class="deposit-btn ">联系门店</view>
  229. </view>
  230. </view>
  231. <!-- <view class="payment-info flex-row flex-between">
  232. <view v-if="orderInfo.order_status == 1 || orderInfo.pay_status == 5" class="flex-row">
  233. <view v-if="orderInfo.order_type != 3"
  234. class="cancel" @tap="clickCancel">结束订单
  235. </view>
  236. <view @tap="callStorePhone" class="deposit-btn ">联系门店</view>
  237. </view>
  238. <view v-if="orderInfo.order_status == 1" class="flex-row">
  239. <view @tap="callStorePhone" class="deposit-btn ">联系门店</view>
  240. <view @tap="navToScan" class="sesame-btn ">扫码绑定</view>
  241. </view>
  242. <view v-if="orderInfo.order_status == 2" class="flex-row">
  243. <view @tap="callStorePhone" class="deposit-btn ">联系门店</view>
  244. <view @tap="navToScan" class="sesame-btn ">去上传</view>
  245. </view>
  246. <view
  247. v-else-if="(orderInfo.order_status == 3||orderInfo.order_status == 4) && orderInfo.order_type != 3 && orderInfo.pay_status != 5"
  248. class="flex-row">
  249. <view @tap="callStorePhone" class="cancel">联系门店</view>
  250. <view @tap="tapReturnCar" class="deposit-btn">到店还车</view>
  251. <view @tap="bindRenew" class="sesame-btn">续租</view>
  252. </view>
  253. <view v-else-if="orderInfo.order_status == 5||orderInfo.order_status == 6" @tap="callStorePhone"
  254. class="pay-btn">
  255. 联系门店</view>
  256. <view v-else-if="orderInfo.order_status == 7" @tap="callStorePhone" class="pay-btn">联系门店</view>
  257. <view v-if="orderInfo.order_type == 3 && (orderInfo.order_status == 3||orderInfo.order_status == 4)"
  258. @tap="callStorePhone" class="pay-btn">联系门店</view>
  259. </view> -->
  260. <view v-if="isShowCancel" class="cancel-b">
  261. <view class="cancel-box">
  262. <view class="cancel-title flex-row flex-between">
  263. <view>选择取消原因</view>
  264. <view @tap="isShowCancel = false" style="font-size: 60rpx;">×</view>
  265. </view>
  266. <view @click="reason = '行程变更无需用车'" class="cancel-item flex-row flex-between">
  267. <view>行程变更无需用车</view>
  268. <img
  269. :src="reason == '行程变更无需用车'?'https://qiniu.bms16.com/FhWimtmWybKlYMB6mgIReVWArbfq':'https://qiniu.bms16.com/Fh0JH6_QbiXYmVy7FNYnDkVIGvLC'" />
  270. </view>
  271. <view @click="reason = '修改订单信息'" class="cancel-item flex-row flex-between">
  272. <view>修改订单信息</view>
  273. <img
  274. :src="reason == '修改订单信息'?'https://qiniu.bms16.com/FhWimtmWybKlYMB6mgIReVWArbfq':'https://qiniu.bms16.com/Fh0JH6_QbiXYmVy7FNYnDkVIGvLC'" />
  275. </view>
  276. <view @click="reason = '不想要了'" class="cancel-item flex-row flex-between">
  277. <view>不想要了</view>
  278. <img
  279. :src="reason == '不想要了'?'https://qiniu.bms16.com/FhWimtmWybKlYMB6mgIReVWArbfq':'https://qiniu.bms16.com/Fh0JH6_QbiXYmVy7FNYnDkVIGvLC'" />
  280. </view>
  281. <view @click="bindCancel" class="cancel_btn">确认取消</view>
  282. </view>
  283. </view>
  284. <returnCar :isShowReturnCar="isShowReturnCar" @closeShowReturnCarBtn="()=>isShowReturnCar=false"
  285. @navStoreBtn="navStoreBtn" @immediatelyReturnBtn="immediatelyReturnBtn" />
  286. <carPlan :isBuy='false' @payToOrder='payReturn' v-if="showCarPlan" @changeSelectType="changeSelectType"
  287. @closeShowMore="showCarPlan = false" :params="params" :selectType="selectType" />
  288. <PayTypeModel @closeShow="()=>isShowToBuy=false" @payToOrder="payToOrder" :free_price="totalPrice"
  289. :isShowToBuy="isShowToBuy" />
  290. </view>
  291. </template>
  292. <script module="tools" lang="wxs" src="@/pages/common/wxs/tools.wxs"></script>
  293. <script module="tools" lang="sjs" src="@/pages/common/wxs/tools.sjs"></script>
  294. <script>
  295. var config_gyq = require('../../common/config_gyq.js');
  296. var config = require('../../common/config.js');
  297. var request = require('../../common/request');
  298. var common = require('../../common/common.js');
  299. var http = require('../../common/http.js');
  300. var storage = require('../../common/storage.js');
  301. var user = require('../../common/user.js');
  302. //
  303. import {
  304. getRemainingTime
  305. } from '@/utils/util';
  306. import {
  307. MAX_LIMITS,LEASE_TYPE_ARR
  308. } from '@/common/constant.js'
  309. var appWhiteListFilter = require('../../common/appWhiteListFilter.js');
  310. import allPrice from '@/component/allPrice/allPrice';
  311. import ReturnCar from '@/component/returnCar/returnCar';
  312. import carPlan from '@/component/carPlan/carPlan';
  313. import PayTypeModel from '@/component/payTypeModel/payTypeModel';
  314. import dayjs from 'dayjs'
  315. import duration from 'dayjs/plugin/duration'
  316. dayjs.extend(duration);
  317. export default {
  318. components: {
  319. allPrice,
  320. ReturnCar,
  321. PayTypeModel,
  322. carPlan
  323. },
  324. data() {
  325. return {
  326. overdueData: {},
  327. select_type: '',
  328. car_detail: {},
  329. showCarPlan: false,
  330. return_imgs: {},
  331. charge_standard: {},
  332. isShowCancel: false,
  333. order_sn: '',
  334. reason: '行程变更无需用车',
  335. orderInfo: {},
  336. shop_image: [],
  337. isExpanded: false,
  338. isShowPrice: false,
  339. timer: '',
  340. isSelectStatus: 1,
  341. price_list: [], //车辆价格 hire_duration_unit 1 日 4 小时 6 周
  342. insurance_status: 0,
  343. over_fee: 0, //逾期金额
  344. plate_number: '',
  345. isScanCondeRentalCar: '',
  346. isShowReturnCar: false,
  347. isShowToBuy: false,
  348. totalPrice: 0, //逾期支付金额
  349. };
  350. },
  351. /**
  352. * 生命周期函数--监听页面加载
  353. */
  354. onLoad: function(options) {
  355. this.sub_sn = options.sub_sn || ''
  356. this.bindOrderInfo()
  357. },
  358. /**
  359. * 生命周期函数--监听页面显示
  360. */
  361. onShow: function(e) {
  362. if (this.sub_sn && this.orderInfo.sub_sn) {
  363. this.bindOrderInfo()
  364. }
  365. },
  366. onUnload: function() {},
  367. computed: {},
  368. methods: {
  369. leaseUnits(type){
  370. const result = LEASE_TYPE_ARR.find(v => v.value == type);
  371. return result ? result.unit : '';
  372. },
  373. leaseUnitsResult(type) {
  374. const result = LEASE_TYPE_ARR.find(v => v.value == type);
  375. return result ? result.label : '';
  376. },
  377. payReturn() {},
  378. //逾期费用计算
  379. async overdueMoneyFn(car_sn) {
  380. let {
  381. data
  382. } = await request.postApi(config_gyq.API_FLK_CAR_OVERDUE_MONEY, {
  383. car_sn
  384. })
  385. if (data.code == 200) {
  386. this.overdueData = data.data
  387. } else {
  388. common.simpleToast(data.msg)
  389. }
  390. },
  391. payToOrder() {},
  392. async loadCarInfo(model_id) {
  393. const me = this
  394. http.postApi(config.API_FLK_INDEX_CAR_MODEL_DETAIL, {
  395. model_id,
  396. }, (resp) => {
  397. if (resp.data.code === 200) {
  398. const pData = {
  399. ...this.car_detail,
  400. price: this.price
  401. }
  402. me.setData({
  403. car_detail: resp.data.data,
  404. params: {
  405. order_sn: this.orderInfo.order_sn,
  406. ...resp.data.data,
  407. price: (resp.data.data.rental_setting[0].hire_price / 100).toFixed(2)
  408. }
  409. })
  410. } else {
  411. common.simpleToast(resp.data.msg);
  412. }
  413. })
  414. },
  415. changeSelectType(select_type, price) {
  416. this.setData({
  417. selectType: select_type,
  418. price: (price / 100).toFixed(2)
  419. })
  420. },
  421. async carDetFn(car_sn) {
  422. let {
  423. data
  424. } = await request.postApi(config.API_FLK_CAR_DETAIL, {
  425. car_sn
  426. })
  427. if (data.code === 200) {
  428. if (data.data.model_id == this.orderInfo.model_id) {
  429. return true
  430. } else {
  431. common.simpleToast('车型不匹配!')
  432. return false
  433. }
  434. if (data.data.is_hire == 1) {
  435. return true
  436. } else {
  437. common.simpleToast('车辆已被租售!')
  438. return false
  439. }
  440. if (data.data.is_display == 1) {
  441. return true
  442. } else {
  443. common.simpleToast('车辆未展示!')
  444. return false
  445. }
  446. } else {
  447. common.simpleToast('请扫描正确的二维码!')
  448. return false
  449. }
  450. return false
  451. },
  452. async navToScan() {
  453. let car_sn = this.orderInfo.car_sn || ''
  454. if (!car_sn) {
  455. let res = await uni.scanCode({
  456. onlyFromCamera: true,
  457. scanType: ['qrCode'],
  458. });
  459. if (res[0]) return
  460. car_sn = res[1].result
  461. if (!await this.carDetFn(car_sn)) return
  462. }
  463. uni.showLoading({
  464. title: '识别中....',
  465. mask: true
  466. })
  467. setTimeout(() => {
  468. uni.hideLoading();
  469. uni.navigateTo({
  470. url: `/pages/activation/activation?model_id=${this.orderInfo.model_id}&sub_sn=${this.sub_sn}&car_sn=${car_sn}`
  471. })
  472. }, 1000);
  473. },
  474. navToCabinet() {
  475. const {
  476. latitude,
  477. longitude,
  478. cityname,
  479. address,
  480. shop_name
  481. } = this.orderInfo
  482. uni.openLocation({
  483. latitude: latitude - 0,
  484. longitude: longitude - 0,
  485. scale: 15,
  486. name: shop_name,
  487. address: address,
  488. success: function(res) {}
  489. });
  490. },
  491. hireDurationUnitFn(type) {
  492. if (type == 1) {
  493. return '天'
  494. } else if (type == 2) {
  495. return '月'
  496. } else if (type == 3) {
  497. return '年'
  498. } else if (type == 4) {
  499. return '小时'
  500. } else if (type == 5) {
  501. return '分钟'
  502. } else if (type == 6) {
  503. return '周'
  504. } else if (type == 7) {
  505. return '季'
  506. }
  507. },
  508. hireDurationUnitsFn(time, type) {
  509. if (type == 1) {
  510. return Math.ceil(time / 60 / 60 / 24)
  511. } else if (type == 2) {
  512. return Math.ceil(time / 60 / 60 / 24 / 30)
  513. } else if (type == 3) {
  514. return Math.ceil(time / 60 / 60 / 24 / 30 / 365)
  515. } else if (type == 4) {
  516. return Math.ceil(time / 60 / 60)
  517. } else if (type == 5) {
  518. return Math.ceil(time / 60)
  519. } else if (type == 6) {
  520. return Math.ceil(time / 60 / 60 / 24 / 7)
  521. } else if (type == 7) {
  522. return Math.ceil(time / 60 / 60 / 24 / 30 / 3)
  523. }
  524. },
  525. async bindOrderInfo() {
  526. const me = this
  527. const locationStr = uni.getStorageSync('user_current_location');
  528. // if (locationStr) {
  529. // this.myLocation = locationStr;
  530. // }
  531. http.postApi(config.API_FLK_ORDER_INFO, {
  532. sub_sn: me.sub_sn,
  533. latitude: locationStr.latitude,
  534. longitude: locationStr.longitude,
  535. }, (resp) => {
  536. if (resp.data.code === 200) {
  537. me.orderInfo = resp.data.data.order_info
  538. me.orderInfo.model_images = me.orderInfo.model_images.split(',')[0]
  539. //
  540. if (resp.data.data.order_info.model_id) {
  541. me.loadCarInfo(resp.data.data.order_info.model_id)
  542. }
  543. let distance = common.getFlatternDistance(locationStr.longitude, locationStr.latitude,
  544. me
  545. .orderInfo.longitude, me.orderInfo.latitude)
  546. resp.data.data.order_info.distance = distance
  547. // 取还时间展示
  548. // me.orderInfo.hire_return_time = common.getTimeToDay(Math.ceil(me.orderInfo
  549. // .hire_end_time - me.orderInfo.hire_begin_time) / 60)
  550. me.orderInfo.hire_return_time = getRemainingTime(me.orderInfo
  551. .hire_begin_time, me
  552. .orderInfo.hire_end_time)
  553. me.orderInfo.hire_begin_times = me.orderInfo.hire_begin_time ? dayjs(me
  554. .orderInfo
  555. .hire_begin_time * 1000).format(
  556. 'YY-MM-DD') : 0
  557. me.orderInfo.hire_end_times = me.orderInfo.hire_end_time ? dayjs(me
  558. .orderInfo
  559. .hire_end_time * 1000).format(
  560. 'YY-MM-DD') : 0
  561. console.log(me.orderInfo.order_status == 1);
  562. let other_time = 0
  563. // 剩余租期判断
  564. //订单状态 0 默认 1 待取车 2 待激活 3 使用中 4 已逾期 5 还车申请中 6 还车中 7 车辆已归还 8 订单已支付,已取消 9 订单未支付已取消
  565. if (me.orderInfo.order_status == 1) {
  566. me.orderInfo.hire_duration_time = common.countToDay(me.orderInfo.hire_cycle * me
  567. .orderInfo.hire_duration, me.orderInfo.hire_duration_unit)
  568. console.log(me.orderInfo.hire_duration_time, 'me.orderInfo.hire_duration_time');
  569. } else if ((me.orderInfo.hire_type == 2 && me.orderInfo.order_status == 2) || me
  570. .orderInfo.order_status == 3) {
  571. // me.orderInfo.hire_duration_time = common.timestampToDays(Math.ceil(me.orderInfo
  572. // .hire_end_time - Math.floor(new Date()) / 1000))
  573. me.orderInfo.hire_duration_time = common.formatTimeDifference(me.orderInfo
  574. .hire_end_time * 1000)
  575. } else {
  576. if (me.orderInfo.order_status == 4) {
  577. me.overdueMoneyFn(me.orderInfo.car_sn)
  578. // me.orderInfo.hire_duration_time = common.timestampToDays(Math.ceil(Math.floor(
  579. // new Date()) / 1000 - me.orderInfo.hire_end_time))
  580. me.orderInfo.hire_duration_time = common.formatTimeDifference(me.orderInfo
  581. .hire_end_time * 1000)
  582. } else {
  583. me.orderInfo.hire_duration_time = common.timestampToDays(Math.ceil(me.orderInfo
  584. .hire_begin_time - me.orderInfo.hire_end_time))
  585. }
  586. }
  587. } else {
  588. // 默认返回上一个页面再提示报错
  589. uni.navigateBack({
  590. delta: 1
  591. })
  592. common.simpleToast(resp.data.msg)
  593. }
  594. })
  595. },
  596. navStoreBtn() {
  597. const {
  598. latitude,
  599. longitude,
  600. address,
  601. shop_name
  602. } = this.orderInfo
  603. uni.openLocation({
  604. latitude: latitude - 0,
  605. longitude: longitude - 0,
  606. scale: 15,
  607. name: shop_name,
  608. address: address,
  609. success: function(res) {}
  610. });
  611. },
  612. tapReturnCar() {
  613. this.setData({
  614. isShowReturnCar: true
  615. })
  616. },
  617. immediatelyReturnBtn() {
  618. //到店还车 判断逾期状态 如果逾期要交逾期费用 跳转到上传车辆图片再支付逾期费用还车
  619. const isOverdue = this.orderInfo.order_status == 4
  620. const {
  621. car_sn,
  622. shop_id,
  623. overdue_money
  624. } = this.orderInfo
  625. const returnCarParams = {
  626. car_sn,
  627. shop_id,
  628. overdue_money,
  629. isReturnCar: true,
  630. }
  631. //提交还车图片
  632. uni.navigateTo({
  633. url: `/pages/activation/activation?isReturnCar=true&model_id=${this.orderInfo.model_id}&sub_sn=${this.sub_sn}&car_sn=${this.orderInfo.car_sn}&isOverdue=${isOverdue}&overdueMoney=${this.overdueData.money}&overdueTime=${this.overdueData.time}&type=index`
  634. });
  635. // if (isOverdue) {
  636. // this.setData({
  637. // totalPrice: this.overdueData.money,
  638. // isShowToBuy: true
  639. // })
  640. // } else {
  641. // //提交还车图片
  642. // uni.navigateTo({
  643. // url: `/pages/activation/activation?isReturnCar=true,model_id=${this.orderInfo.model_id}&sub_sn=${this.sub_sn}&car_sn=${this.orderInfo.car_sn}&isOverdue=${isOverdue}&overdueMoney=${this.overdueData.money}&overdueTime=${this.overdueData.time}`
  644. // });
  645. // }
  646. },
  647. callStorePhone() {
  648. const phone = this.orderInfo.link_phone
  649. common.callPhone(phone)
  650. },
  651. async clickCancel() {
  652. this.isShowCancel = true
  653. },
  654. async bindCancel() {
  655. const me = this
  656. let res = await uni.showModal({
  657. title: '取消订单',
  658. content: '您是否需要取消该订单',
  659. confirmText: '是',
  660. confirmColor: '#0074FF',
  661. cancelText: '否',
  662. cancelColor: '#191D23',
  663. });
  664. if (res[1].confirm) {
  665. let {
  666. data
  667. } = await request.postApi(config.API_DAYHIRE_HIRE_CANCEL_ORDER, {
  668. sub_sn: this.sub_sn,
  669. remark: this.reason
  670. })
  671. if (data.code == 200) {
  672. common.simpleToast(data.msg)
  673. this.isShowCancel = false
  674. this.bindOrderInfo()
  675. } else {
  676. common.simpleToast(data.msg)
  677. }
  678. }
  679. },
  680. bindToNav() {
  681. console.log(111);
  682. const {
  683. address,
  684. latitude,
  685. longitude,
  686. shop_name
  687. } = this.shopInfo
  688. uni.openLocation({
  689. latitude: latitude - 0,
  690. longitude: longitude - 0,
  691. scale: 15,
  692. name: shop_name,
  693. address: address,
  694. success: function(res) {},
  695. })
  696. },
  697. bindToHome() {
  698. uni.reLaunch({
  699. url: '/pages/index/index',
  700. success: function(res) {},
  701. fail: function(res) {},
  702. complete: function(res) {}
  703. });
  704. },
  705. callPhone() {
  706. const me = this
  707. const phone = me.shopInfo.link_phone
  708. uni.showModal({
  709. content: `您是否要拨打电话${phone}?`,
  710. confirmText: '确定',
  711. success: (res) => {
  712. if (res.confirm) {
  713. uni.makePhoneCall({
  714. phoneNumber: phone,
  715. success() {},
  716. fail() {}
  717. })
  718. }
  719. },
  720. fail: (res) => {}
  721. })
  722. },
  723. bindRenew() {
  724. this.params.overdueData = this.overdueData
  725. this.showCarPlan = true
  726. // this.isReturnHome = false
  727. // let isRenew = true
  728. // uni.navigateTo({
  729. // url: '/pages/carIntroduce/carIntroduce?plate_number=' + this.orderInfo
  730. // .license_plate_number +
  731. // '&isRenew=' + isRenew +
  732. // '&order_sn=' + this.order_sn,
  733. // success: function(res) {},
  734. // fail: function(res) {},
  735. // complete: function(res) {}
  736. // });
  737. },
  738. bindBattery() {
  739. this.isReturnHome = false
  740. uni.navigateTo({
  741. url: '/pages/battery/battery?plate_number=' + this.orderInfo.license_plate_number,
  742. success: function(res) {},
  743. fail: function(res) {},
  744. complete: function(res) {}
  745. });
  746. },
  747. bindExpanded() {
  748. this.isExpanded = !this.isExpanded
  749. },
  750. navToInput() {
  751. this.isReturnHome = false
  752. uni.navigateTo({
  753. url: '/pages/inputLicensePlate/inputLicensePlate?order_sn=' + this.orderInfo
  754. .order_sn,
  755. success: function(res) {},
  756. fail: function(res) {},
  757. complete: function(res) {}
  758. });
  759. },
  760. // 激活车辆
  761. navToActive() {
  762. this.isReturnHome = false
  763. const me = this
  764. if (this.orderInfo.hire_type == 1) { // 预约
  765. if (me.isScanCondeRentalCar) {
  766. uni.scanCode({
  767. onlyFromCamera: true,
  768. success: function(res) {
  769. me.loadScanCode(res.result)
  770. },
  771. fail: function(res) {},
  772. complete: function(res) {},
  773. })
  774. } else {
  775. uni.navigateTo({
  776. url: '/pages/inputLicensePlate/inputLicensePlate?order_sn=' + this
  777. .order_sn + '&order_model_id=' + this.orderInfo.model_id,
  778. success: function(res) {},
  779. fail: function(res) {},
  780. complete: function(res) {}
  781. });
  782. }
  783. } else { // 非预约
  784. const isJumpReturn = false
  785. uni.navigateTo({
  786. url: '/pages/activation/activation?order_sn=' + this.order_sn +
  787. '&plate_number=' + this
  788. .orderInfo.license_plate_number + '&isJumpReturn=' + isJumpReturn,
  789. success: function(res) {},
  790. fail: function(res) {},
  791. complete: function(res) {}
  792. });
  793. }
  794. },
  795. loadScanCode(battery_sn) {
  796. const pData = {
  797. longitude: this.longitude,
  798. latitude: this.latitude,
  799. battery_sn: battery_sn
  800. }
  801. const me = this
  802. http.postApi(config.API_DAYHIRE_CAR_CAR_INFO, pData, (resp) => {
  803. uni.hideLoading()
  804. if (resp.data.code === 200) {
  805. const timestamp = Date.now(); // 获取当前时间戳(毫秒)
  806. const isOffline = (Math.floor(timestamp / 1000) - resp.data.data
  807. .last_comm_time) > 1800
  808. me.plate_number = resp.data.data.license_plate_number
  809. if (resp.data.data.last_comm_time === 0 || isOffline) {
  810. common.simpleToast('此车辆已离线,请选择其他车辆')
  811. } else {
  812. let carInfo = JSON.stringify(resp.data.data)
  813. const car_model = resp.data.data.model_info.car_model
  814. const model_images = resp.data.data.model_info.model_images.split(',')
  815. const return_imgs = resp.data.data.return_imgs
  816. var model_id = resp.data.data.model_info.model_id
  817. if (resp.data.data.has_owner) { //车辆正在被使用
  818. if (resp.data.data.is_mine) { //是本人在使用
  819. wx.showModal({
  820. title: '提示',
  821. content: '已有正在使用的车辆,是否跳转至车辆详情页?',
  822. cancelText: '取消',
  823. confirmText: '确定',
  824. success: function(res) {
  825. this.isReturnHome = false
  826. uni.navigateTo({
  827. url: '/pages/battery/battery?plate_number=' +
  828. this.plate_number
  829. });
  830. },
  831. fail: function(res) {},
  832. complete: function(res) {},
  833. })
  834. } else {
  835. common.simpleToast('此车辆正在被使用')
  836. }
  837. } else {
  838. if (me.order_sn && me.order_sn != '') {
  839. if (this.orderInfo.model_id != model_id) { // 预租车型与之前预约车型不一致
  840. common.simpleToast('与预约车型不符')
  841. } else {
  842. this.isReturnHome = false
  843. uni.navigateTo({
  844. url: '/pages/activation/activation?plate_number=' +
  845. this.plate_number + '&order_sn=' + this
  846. .order_sn +
  847. '&car_model=' + car_model + '&model_image=' +
  848. model_images[0] + '&return_imgs=' + JSON
  849. .stringify(
  850. return_imgs),
  851. fail() {}
  852. })
  853. }
  854. } else {
  855. this.isReturnHome = false
  856. uni.navigateTo({
  857. url: '/pages/carIntroduce/carIntroduce?carInfo=' +
  858. encodeURIComponent(carInfo) + '&plate_number=' +
  859. this.plate_number,
  860. fail() {}
  861. })
  862. }
  863. }
  864. }
  865. } else {
  866. common.simpleToast(resp.data.msg)
  867. }
  868. })
  869. },
  870. bindToPay() {
  871. const me = this
  872. //#ifdef MP-ALIPAY
  873. const _from = 'ali'
  874. const _pay_type = 2
  875. //#endif
  876. //#ifdef MP-WEIXIN
  877. const _from = 'wx'
  878. const _pay_type = 0
  879. //#endif
  880. http.postApi(config.API_DAYHIRE_HIRE_CONTINUE_PAY, {
  881. order_sn: me.order_sn,
  882. from: _from,
  883. pay_type: _pay_type
  884. }, (resp) => {
  885. common.loading()
  886. if (resp.data.code === 200) {
  887. uni.hideLoading()
  888. //#ifdef MP-ALIPAY
  889. my.tradePay({
  890. tradeNO: resp.data.data.trade_no,
  891. success: function(res) {
  892. if (res.resultCode == 9000) {
  893. common.simpleToast('支付成功');
  894. }
  895. setTimeout(function() {
  896. me.bindOrderInfo()
  897. }, 1000)
  898. },
  899. fail: function(res) {
  900. common.simpleToast('支付失败,请重试')
  901. },
  902. })
  903. //#endif
  904. //#ifdef MP-WEIXIN
  905. var payParams = JSON.parse(resp.data.data.payParams);
  906. user.wxPay(me.order_sn, payParams, function(isSuccess) {
  907. if (isSuccess) {
  908. common.simpleToast('支付成功')
  909. setTimeout(function() {
  910. me.bindOrderInfo()
  911. }, 1000)
  912. } else {
  913. common.simpleToast('支付失败,请重试')
  914. }
  915. });
  916. //#endif
  917. } else {
  918. uni.hideLoading()
  919. common.simpleToast(resp.data.msg)
  920. }
  921. })
  922. },
  923. // 计算拖车说明收费价格
  924. calculateFare(distance, charge_list) {
  925. let fare = 0
  926. if (distance <= charge_list.start_mil) {
  927. fare = charge_list.start_price / 100
  928. } else {
  929. // actual_start_mil:实际距离单位米
  930. // over_start_price:向上取整的公里数*超出首公里的费用
  931. var actual_start_mil = distance - charge_list.start_mil
  932. var over_start_price = (Math.ceil(actual_start_mil / charge_list.step_mil)) * charge_list
  933. .step_price
  934. fare = (charge_list.start_price + over_start_price) / 100
  935. }
  936. const fareArray = fare.toFixed(2).split('.'); //将价格拆分为整数部分和小数部分
  937. const price_list = {
  938. start_mil: (charge_list.start_mil / 1000).toFixed(2),
  939. start_price: (charge_list.start_price / 100).toFixed(2),
  940. step_mil: (charge_list.step_mil / 1000).toFixed(2),
  941. step_price: (charge_list.step_price / 100).toFixed(2),
  942. actual_start_mil: actual_start_mil ? (actual_start_mil / 1000).toFixed(2) : 0,
  943. over_start_price: over_start_price ? (over_start_price / 100).toFixed(2) : 0,
  944. fare: fare.toFixed(2), // 保留两位小数
  945. fareArray: fareArray //将价格拆分为整数部分和小数部分
  946. }
  947. return price_list
  948. },
  949. bindChangeStatus(e) {
  950. const {
  951. status,
  952. unit
  953. } = e.currentTarget.dataset
  954. this.setData({
  955. isSelectStatus: unit,
  956. selectIndex: status
  957. })
  958. // this.bindDuration()
  959. },
  960. //计算价格
  961. // bindDuration(){
  962. // const me = this
  963. // var _insurance_price //保险金
  964. // const unit_price=(me.price_list[0].hire_price/100) * me.leaseTime //租金
  965. // // insurance_setting 保险
  966. // if (me.insurance_setting!=null) { // 有保险的时候
  967. // // isSelectDeposit==0为免押 isOpenNoDeposit为是否成功开通免押 total_money为总金额
  968. // // unit_price 租金 insurance_setting.price 保险金 deposit 押金
  969. // if (me.duration_unit == 4) { // 时
  970. // _insurance_price = (me.insurance_setting.price - 0) * 1
  971. // } else if(me.duration_unit == 6) { // 周
  972. // _insurance_price = (me.insurance_setting.price - 0) * 7 * me.leaseTime
  973. // } else { //天
  974. // _insurance_price = (me.insurance_setting.price - 0) * me.leaseTime
  975. // }
  976. // } else { // 无保险
  977. // _insurance_price = 0
  978. // }
  979. // if (me.isOpenNoDeposit) {
  980. // // 金额=(周期数*周期价格)+保险金
  981. // me.amount = ((me.leaseTime * me.price_list[0].hire_price -0) + (_insurance_price - 0)) / 100
  982. // } else {
  983. // // 金额=(周期数*周期价格)+押金+保险金
  984. // me.amount = ((me.leaseTime * me.price_list[0].hire_price -0) + (me.modelInfo.deposit -0) + (_insurance_price - 0)) / 100
  985. // }
  986. // },
  987. loadEnd() {
  988. this.bindOrderInfo()
  989. },
  990. navToExchange() {
  991. console.log('跳转换电记录');
  992. uni.navigateTo({
  993. url: '/pages/exchangeRecord/exchangeRecord' +
  994. '?order_sn=' + this.orderInfo.order_sn
  995. })
  996. }
  997. }
  998. };
  999. </script>
  1000. <style>
  1001. @import './orderStatus.css';
  1002. .cancel_btn {
  1003. width: 702rpx;
  1004. height: 80rpx;
  1005. background: #060809;
  1006. border-radius: 40rpx;
  1007. font-family: PingFangSC, PingFang SC;
  1008. font-weight: 500;
  1009. font-size: 32rpx;
  1010. color: #FFFFFF;
  1011. display: flex;
  1012. align-items: center;
  1013. justify-content: center;
  1014. }
  1015. </style>