refund-detail.php 37 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862
  1. <?php
  2. use common\helpers\ComponentHelper;
  3. ComponentHelper::loadComponentView('component/order-refund', __DIR__);
  4. ?>
  5. <style>
  6. .card-box {
  7. border: none;
  8. }
  9. .marign-b-20 {
  10. margin-bottom: 20px;
  11. }
  12. .step-box {
  13. margin-top: 10px;
  14. padding-top: 10px;
  15. }
  16. .step-inactive {
  17. position: absolute;
  18. top: 50%;
  19. left: 50%;
  20. width: 34px;
  21. height: 34px;
  22. border-radius: 50%;
  23. background-color: #e8e8e8;
  24. transform: translate(-50%, -50%);
  25. }
  26. .step-inside {
  27. position: absolute;
  28. top: 50%;
  29. left: 50%;
  30. width: 25px;
  31. height: 25px;
  32. border-radius: 50%;
  33. background-color: #cccbcb;
  34. transform: translate(-50%, -50%);
  35. text-align: center;
  36. line-height: 24px;
  37. z-index: 9;
  38. color: #fff;
  39. font-size: 12px;
  40. }
  41. .step-active {
  42. background-color: var(--primary, #fb6638);
  43. }
  44. .step-outside {
  45. background-color: transparent;
  46. }
  47. .step-box .el-step__title {
  48. font-size: 14px;
  49. }
  50. .text-other {
  51. padding: 10px 0;
  52. font-size: 12px;
  53. }
  54. .text-other>span:nth-child(1) {
  55. display: block;
  56. width: 100%;
  57. padding-left: 20px;
  58. text-align: left;
  59. }
  60. .text-child {
  61. padding: 5px 0 0 30px;
  62. color: #999;
  63. }
  64. .text-child>span {
  65. display: block;
  66. padding-top: 10px;
  67. }
  68. .text-item {
  69. padding: 10px 0;
  70. font-size: 12px;
  71. }
  72. .row-card-header {
  73. font-weight: 700;
  74. font-size: 14px;
  75. }
  76. .text-item>span:nth-child(1) {
  77. display: inline-block;
  78. width: 105px;
  79. padding-right: 20px;
  80. text-align: right;
  81. }
  82. .el-row-flex {
  83. display: flex;
  84. flex-flow: row wrap;
  85. }
  86. .el-row-flex .card-box {
  87. height: 100%;
  88. }
  89. .order-goods .el-table th>.cell,
  90. .order-goods .el-table {
  91. font-size: 13px;
  92. }
  93. .package-item {
  94. padding: 10px 0;
  95. font-size: 12px;
  96. }
  97. .package-item>span:nth-child(1) {
  98. display: inline-block;
  99. width: 105px;
  100. padding: 0 20px;
  101. text-align: left;
  102. }
  103. .package-item img {
  104. width: 55px;
  105. height: 55px;
  106. border-radius: 5px;
  107. margin-right: 10px;
  108. }
  109. .range-right {
  110. margin-right: 20px;
  111. }
  112. .color-red {
  113. color: red;
  114. }
  115. .color-green {
  116. color: green;
  117. }
  118. .consult {
  119. max-height: 600px;
  120. width: 100%;
  121. overflow-x: hidden;
  122. overflow-y: auto;
  123. }
  124. .consult li {
  125. border-bottom: 1px solid #EBEEF5;
  126. font-size: 12px;
  127. padding: 10px 0 20px 10px;
  128. }
  129. .consult li div {
  130. /* display: block; */
  131. padding: 5px 0;
  132. }
  133. .handle-btn {
  134. display: inline-block;
  135. position: absolute;
  136. right: 0px;
  137. top: -5px;
  138. }
  139. .el-dialog {
  140. border-radius: 5px;
  141. }
  142. .el-dialog__header {
  143. padding:10px 30px;
  144. border-bottom: 1px solid #f2f2f2;
  145. }
  146. .el-form-item--small {
  147. margin:10px 0;
  148. }
  149. .el-form-item--small {
  150. margin-bottom:0 !important;
  151. }
  152. </style>
  153. <div id="app" v-cloak>
  154. <el-card shadow="never" style="border: none;" body-style="background-color: #f3f3f3;padding: 10px 0 0;" v-loading="cardLoading">
  155. <div slot="header">
  156. <span>订单详情</span>
  157. </div>
  158. <el-card class="card-box step-box marign-b-20" shadow="never">
  159. <el-steps :active="stepArrActive">
  160. <el-step v-for="(item,index) in stepArr" :key="index" :title="item.title" :description="item.created_at|dateTimeFormat('Y-m-d H:i:s')">
  161. <template slot="icon">
  162. <div class="step-inactive" :class="item.is_step == 1 ? 'step-outside' : ''">
  163. <div class="step-inside" :class="item.is_step == 1 ? 'step-active' : ''">{{ index + 1 }}</div>
  164. </div>
  165. </template>
  166. </el-step>
  167. </el-steps>
  168. </el-card>
  169. <el-row :gutter="20" class="el-row-flex marign-b-20">
  170. <el-col :span="8">
  171. <el-card class="card-box" shadow="never">
  172. <div slot="header" class="clearfix row-card-header" style="position: relative;">
  173. <span>售后信息</span>
  174. <template v-if="step_status != -1 || step_status != -2">
  175. <!-- 仅退款 -->
  176. <template v-if="orderDetail.order.order_source == 'WechatVideoShop'">
  177. <div class="handle-btn">
  178. <a target="_blank" href="https://channels.weixin.qq.com/shop"><el-button type="danger" size="small">前往视频号小店操作</el-button></a>
  179. </div>
  180. </template>
  181. <template v-else>
  182. <div class="handle-btn" v-if="orderDetail.type == 1">
  183. <div v-if="!q_refund || (q_refund && q_refund.status == 0)">
  184. <el-button type="primary" size="small" v-if="step_status == 5" @click="handle('handle', orderDetail, 6)">
  185. {{goods.goods_source == 'QiJuhe' ? '推送售后' : '同意退款'}}
  186. </el-button>
  187. <el-button plain size="small" v-if="step_status == 5" @click="handle('handle', orderDetail, -1)">
  188. {{goods.goods_source == 'QiJuhe' ? '驳回售后' : '拒绝售后申请'}}
  189. </el-button>
  190. </div>
  191. </div>
  192. <!-- 退货退款 -->
  193. <div class="handle-btn" v-if="orderDetail.type == 2">
  194. <div v-if="!q_refund || (q_refund && q_refund.status == 0)">
  195. <el-button type="primary" size="small" v-if="step_status == 1" @click="handle('send_address', orderDetail, 2)">
  196. {{goods.goods_source == 'QiJuhe' ? '推送售后' : '同意退货,发送退货地址'}}
  197. </el-button>
  198. <el-button plain size="small" v-if="step_status == 1" @click="handle('handle', orderDetail, -1)">
  199. {{goods.goods_source == 'QiJuhe' ? '驳回售后' : '拒绝售后申请'}}
  200. </el-button>
  201. </div>
  202. <el-button :loading="btnLoading" type="warning" plain size="small" v-if="step_status == 2 && is_show_revoce" @click="revoceRefund(orderDetail.id)">退货超期,撤销售后</el-button>
  203. <el-button plain size="small" v-if="step_status == 2" @click="handle('handle', orderDetail, 4)">已收到退货,同意退款</el-button>
  204. <el-button type="primary" size="small" v-if="step_status == 3" @click="handle('handle', orderDetail, 4)">确认收货并退款</el-button>
  205. <el-button plain size="small" v-if="step_status == 3" @click="handle('handle', orderDetail, -2)">拒绝确认收货</el-button>
  206. </div>
  207. <!-- 换货 -->
  208. <div class="handle-btn" v-if="orderDetail.type == 3">
  209. <div v-if="!q_refund || (q_refund && q_refund.status == 0)">
  210. <el-button type="primary" size="small" v-if="step_status == 7" @click="handle('send_address', orderDetail, 8)">
  211. {{goods.goods_source == 'QiJuhe' ? '推送售后' : '同意换货,发送退货地址'}}
  212. </el-button>
  213. <el-button plain size="small" v-if="step_status == 7" @click="handle('handle', orderDetail, -1)">
  214. {{goods.goods_source == 'QiJuhe' ? '驳回售后' : '拒绝售后申请'}}
  215. </el-button>
  216. </div>
  217. <el-button :loading="btnLoading" type="warning" plain size="small" v-if="step_status == 8 && is_show_revoce" @click="revoceRefund(orderDetail.id)">退货超期,撤销售后</el-button>
  218. <el-button plain size="small" v-if="step_status == 8" @click="handle('exchange', orderDetail, 10)">已收到退货,立即发货</el-button>
  219. <el-button type="primary" size="small" v-if="step_status == 9" @click="handle('exchange', orderDetail, 10)">确认收货并重新发货</el-button>
  220. <el-button plain size="small" v-if="step_status == 9" @click="handle('handle', orderDetail, -2)">拒绝确认收货</el-button>
  221. <el-button plain size="small" v-if="step_status == 10" @click="refundTakeDelivery(orderDetail.id)">确认收货,售后完成</el-button>
  222. </div>
  223. </template>
  224. </template>
  225. </div>
  226. <div class="text-item">
  227. <span>售后状态</span><span class="text-color-primary">{{ stepText.title }}</span>
  228. </div>
  229. <!-- 换货情况下不显示退款金额 -->
  230. <div class="text-item" v-if="orderDetail.type != 3">
  231. <span>退款金额</span><span>¥{{ orderDetail.refund_price }} <span v-if="orderDetail.discount">+ {{orderDetail.discount}}</span></span>
  232. <template v-if="orderDetail.refund_items && orderDetail.refund_items.length">
  233. (
  234. <span v-for="item in orderDetail.refund_items" style="color: var(--danger);">
  235. {{ payment_type_list[item.pay_type] }}
  236. :
  237. {{ item.refund_fee.toFixed(2) }}
  238. </span>
  239. )
  240. </template>
  241. </div>
  242. <div class="text-item">
  243. <span>退款方式</span><span>{{ orderDetail.payment_refund_type || '-' }}</span>
  244. </div>
  245. <div class="text-item" v-if="orderDetail.type != 3">
  246. <span>需返</span><span>{{ orderDetail.discount || '-' }}</span>
  247. </div>
  248. <div class="text-item">
  249. <span>售后原因</span><span>{{ orderDetail.reason || '-' }}</span>
  250. </div>
  251. <div class="text-item">
  252. <span>售后说明</span><span>{{ orderDetail.remark || '-' }}</span>
  253. </div>
  254. <div class="text-item">
  255. <span>售后编号</span><span>{{ orderDetail.order_no }}</span>
  256. </div>
  257. </el-card>
  258. </el-col>
  259. <el-col :span="8">
  260. <el-card class="card-box " shadow="never">
  261. <div slot="header" class="clearfix row-card-header">
  262. <span>买家及收货信息</span>
  263. </div>
  264. <div class="text-item">
  265. <span>买家</span><span>{{ orderDetail.base_user.nickname }}</span>
  266. </div>
  267. <div class="text-item">
  268. <span>买家备注</span><span>{{ orderDetail.remark || '--' }}</span>
  269. </div>
  270. <div class="text-item" v-if="orderDetail.order.is_virtual == 0">
  271. <span>配送方式</span><span>{{ shipping_type_list[orderDetail.order.shipping_type] }}</span>
  272. </div>
  273. <div class="text-item">
  274. <span>收货人</span><span>{{ orderDetail.order.receiver_name || '--' }}</span>
  275. </div>
  276. <div class="text-item">
  277. <span>收货地址</span><span>{{ orderDetail.order.region_name }} {{ orderDetail.order.address }}</span>
  278. </div>
  279. <div class="text-item">
  280. <span>手机号码</span><span>{{ orderDetail.order.mobile }}</span>
  281. </div>
  282. <div v-if="orderDetail.order.pickup_info">
  283. <h4>自提点信息</h4>
  284. <div class="text-item">
  285. <span>联系人姓名</span><span>{{ orderDetail.order.pickup_info.head_info.contact_name }}</span>
  286. </div>
  287. <div class="text-item">
  288. <span>手机号码</span><span>{{ orderDetail.order.pickup_info.head_info.contact_phone }}</span>
  289. </div>
  290. <div class="text-item">
  291. <span>详细地址</span><span>{{ orderDetail.order.pickup_info.head_info.address }}</span>
  292. </div>
  293. </div>
  294. <div v-if="orderDetail.refund_status == 4" class="text-other" style="padding-bottom: 0px;">
  295. <span>客户退回信息</span>
  296. <div class="text-child">
  297. <span>快递公司:{{ orderDetail.express }}</span>
  298. <span>快递单号:{{ orderDetail.express_no }}</span>
  299. </div>
  300. </div>
  301. <div class="text-other">
  302. <!--订单状态为拒绝退款时不显示订单完成列表-->
  303. <span v-if="orderDetail.type == 1 && orderDetail.refund_status == 1 && orderDetail.step_status != -1">退款已完成,退款金额:{{ orderDetail.reality_refund_price }} 元 <span v-if="orderDetail.discount">+ {{orderDetail.discount}}</span></span><span></span>
  304. <span v-if="orderDetail.type == 2 && orderDetail.refund_status == 1 && orderDetail.step_status != -1">退款退货已完成,退款金额:{{ orderDetail.reality_refund_price }} 元 <span v-if="orderDetail.discount">+ {{orderDetail.discount}}</span></span><span></span>
  305. <span v-if="orderDetail.type == 3 && orderDetail.refund_status == 1 && orderDetail.step_status != -1">换货已完成</span><span></span>
  306. </div>
  307. </el-card>
  308. </el-col>
  309. <el-col :span="8">
  310. <el-card class="card-box" shadow="never">
  311. <div slot="header" class="clearfix row-card-header">
  312. <span>订单信息</span>
  313. </div>
  314. <div class="text-item">
  315. <span>订单状态</span><span :class="orderGoods.is_feedback == 1 ? 'color-red' : 'color-green'">{{ feedback_type_list[orderGoods.is_feedback] }}</span>
  316. </div>
  317. <div class="text-item">
  318. <span>订单编号</span><span>{{ orderDetail.order.order_no }}</span>
  319. </div>
  320. <div class="text-item">
  321. <span>交易单号</span><span>{{ orderDetail.order.out_trade_no || '-' }}</span>
  322. </div>
  323. <div class="text-item">
  324. <span>支付方式</span><span>{{ payment_type_list[orderDetail.order.payment_type] }}</span>
  325. </div>
  326. </el-card>
  327. </el-col>
  328. </el-row>
  329. <el-card class="card-box marign-b-20" shadow="never">
  330. <div slot="header" class="clearfix row-card-header">
  331. <span>商品信息</span>
  332. </div>
  333. <div class="order-goods">
  334. <el-table :data="orderGoodsList" style="width: 100%;" :header-cell-style="{background:'#F7F7F7','border-bottom': 0}">
  335. <el-table-column label="商品" width="260">
  336. <template slot-scope="scope">
  337. <div style="display: flex;align-items: center;">
  338. <el-image style="width: 50px; height: 50px;border-radius: 5px;margin-right: 10px" :src="scope.row.pic_url"></el-image>
  339. <com-ellipsis :line="2">
  340. {{ scope.row.goods_name }}
  341. </com-ellipsis>
  342. </div>
  343. </template>
  344. </el-table-column>
  345. <el-table-column label="规格" width="210">
  346. <template slot-scope="scope">
  347. <el-tag size="small">
  348. {{ scope.row.goods_attr_name || '无规格' }}
  349. </el-tag>
  350. </template>
  351. </el-table-column>
  352. <el-table-column label="单价" width="210">
  353. <template slot-scope="scope">
  354. <div>{{ getOrderPrice(scope.row) }}
  355. <span v-if="scope.row.adjust_money != 0">(调价:¥{{ scope.row.adjust_money }})</span>
  356. </div>
  357. </template>
  358. </el-table-column>
  359. <el-table-column label="购买数量" width="210">
  360. <template slot-scope="scope">
  361. <div>{{ scope.row.num }}</div>
  362. </template>
  363. </el-table-column>
  364. <el-table-column label="优惠" width="210">
  365. <template slot-scope="scope">
  366. <div>¥{{ (scope.row.price * scope.row.num - scope.row.goods_price).toFixed(2) }}</div>
  367. </template>
  368. </el-table-column>
  369. <el-table-column label="小计" width="210">
  370. <template slot-scope="scope">
  371. <div>{{ getOrderPrice(scope.row) }}</div>
  372. </template>
  373. </el-table-column>
  374. <el-table-column label="状态">
  375. <template slot-scope="scope">
  376. <div>{{ feedback_type_list[scope.row.is_feedback] }}</div>
  377. </template>
  378. </el-table-column>
  379. </el-table>
  380. </div>
  381. </el-card>
  382. <el-card v-if="orderDetail.step.length > 0" class="card-box marign-b-20" shadow="never">
  383. <div slot="header" class="clearfix row-card-header">
  384. <span>协商记录</span>
  385. </div>
  386. <ul class="consult">
  387. <li v-for="(item,index) in orderDetail.step">
  388. <div><span style="color: #409eff; padding-right: 10px;">{{ item.role == 1 ? '买家' : '商家' }}</span> {{ item.created_at|dateTimeFormat('Y-m-d H:i:s')}}</div>
  389. <template v-for="val in JSON.parse(item.content)">
  390. <template v-if="typeof val == 'object'">
  391. <el-image
  392. v-for="img,k in val"
  393. style="width: 100px; height: 100px; margin-right: 20px; display: inline-block;"
  394. :src="img"
  395. :key="k"
  396. :preview-src-list="val">
  397. </el-image>
  398. </template>
  399. <div v-else>{{ val }}</div>
  400. </template>
  401. </li>
  402. </ul>
  403. </el-card>
  404. <el-card>
  405. <el-button type="primary" v-if="orderDetail.order_status == 1" size="small" @click="handle('shipping', orderDetail)">发货</el-button>
  406. <el-button type="primary" v-if="orderDetail.order_status == 2" size="small" @click="handle('take-delivery', orderDetail)">确认收货</el-button>
  407. <el-button type="primary" v-if="orderDetail.order_status == 3" size="small" @click="handle('sales', orderDetail)">订单完成</el-button>
  408. </el-card>
  409. </el-card>
  410. <!-- 修改退货地址 -->
  411. <order-refund :is_show="isShowChangeShipping"
  412. :handle_step_status="handleStepStatus"
  413. :handle_type="handleType"
  414. :change-shipping-loading="changeShippingLoading"
  415. :refund_info="orderDetail"
  416. :default_address="default_address"
  417. @submit="handleShipping"
  418. @close="isShowChangeShipping = false"
  419. :address_list = "address_list"
  420. @address = "selectAddress"
  421. ></order-refund>
  422. <el-dialog title="拒绝理由" :visible.sync="dialogVisible" width="30%" :before-close="handleClose" :close-on-click-modal="false">
  423. <el-input
  424. type="textarea"
  425. :autosize="{ minRows: 4, maxRows: 6}"
  426. placeholder="请输入内容"
  427. v-model="refund_reason">
  428. </el-input>
  429. <span slot="footer" class="dialog-footer">
  430. <el-button @click="handleClose">取 消</el-button>
  431. <el-button type="primary" @click="handle('refuse',{})">确 定</el-button>
  432. </span>
  433. </el-dialog>
  434. <el-dialog title="售后处理" :visible.sync="dialogFormVisibleRefund" :before-close="closeRefundForm">
  435. <el-form :model="refundForm">
  436. <el-form-item label="售后类型:" :label-width="formLabelWidth">
  437. {{refund_type}}
  438. </el-form-item>
  439. <el-form-item label="售后金额:" :label-width="formLabelWidth">
  440. {{orderDetail.refund_price}}
  441. </el-form-item>
  442. <!-- <el-form-item label="实付金额:" :label-width="formLabelWidth">-->
  443. <!-- {{orderDetail.orderDetail.goods_price}}-->
  444. <!-- </el-form-item>-->
  445. <el-form-item label="运费金额:" :label-width="formLabelWidth">
  446. {{orderDetail.order.shipping_money ?? 0}}
  447. </el-form-item>
  448. <el-form-item label="退款金额:" :label-width="formLabelWidth">
  449. <el-input v-model="refundForm.refund_price" onInput="value=toNumber(value,2)"></el-input>
  450. <span style="color: var(--danger); font-size: 13px;">组合支付情况下不支持自定义退款金额</span>
  451. </el-form-item>
  452. <el-form-item label="备注:" :label-width="formLabelWidth">
  453. <el-input v-model="refundForm.refund_remark" ></el-input>
  454. </el-form-item>
  455. </el-form>
  456. <div slot="footer" class="dialog-footer">
  457. <el-button @click="closeRefundForm">取 消</el-button>
  458. <el-button type="primary" @click="handleRefund">确 定</el-button>
  459. </div>
  460. </el-dialog>
  461. </div>
  462. <script>
  463. const app = new Vue({
  464. el: '#app',
  465. data() {
  466. return {
  467. id: 0,
  468. detail: {},
  469. isShowChangeShipping: false,
  470. changeShippingLoading: false,
  471. dialogVisible:false,
  472. shipping_form: {},
  473. activePackage: '0',
  474. handleType: '',
  475. cardLoading: false,
  476. logLoading: false,
  477. step_status: 0,
  478. orderGoodsList: [],
  479. goodDetails: [],
  480. orderAction: [],
  481. feedback_type_list: {},
  482. q_refund: null,
  483. stepArrs: {
  484. "1": [
  485. {
  486. title: '买家下单',
  487. created_at: '0',
  488. is_step: 0,
  489. },
  490. {
  491. title: '买家付款',
  492. created_at: '0',
  493. is_step: 0,
  494. },
  495. {
  496. title: '商家发货',
  497. created_at: '0',
  498. is_step: 0,
  499. },
  500. {
  501. title: '交易完成',
  502. created_at: '0',
  503. is_step: 0,
  504. }
  505. ],
  506. },
  507. stepArr: [
  508. {
  509. title: '售后申请',
  510. created_at: '0',
  511. is_step: 0,
  512. },
  513. {
  514. title: '处理售后申请',
  515. created_at: '0',
  516. is_step: 0,
  517. },
  518. {
  519. title: '售后完成',
  520. created_at: '0',
  521. is_step: 0,
  522. },
  523. ],
  524. stepArrActive: 0,
  525. handleStepStatus: 0,
  526. orderDetail: {
  527. express: [],
  528. step: [],
  529. order: {}
  530. },
  531. orderGoods: {},
  532. orderExpress: [],
  533. stepText: {},
  534. order_status_list: {
  535. '0': "待付款",
  536. '1': "待发货",
  537. '2': "已发货",
  538. '3': "已收货",
  539. '4': "已完成",
  540. '-1': "售后申请",
  541. '-2': "退款中",
  542. '-3': "售后完成",
  543. '-4': "已关闭",
  544. '-5': "撤销申请",
  545. },
  546. payment_type_list: {
  547. '0': "在线支付",
  548. '1': "微信",
  549. '2': "支付宝",
  550. '3': "银联卡",
  551. '5': "余额支付",
  552. '7': "汇聚支付",
  553. '8': "汇聚快捷支付",
  554. '100': "线下支付"
  555. },
  556. shipping_type_list: {
  557. '1': "物流配送",
  558. '2': "买家自提",
  559. '3': "货到付款",
  560. '4': "本地配送"
  561. },
  562. default_address: {},
  563. address_list : [],
  564. refund_reason : '',
  565. temp_param: {},
  566. is_show_revoce: false,
  567. btnLoading: false,
  568. dialogFormVisibleRefund: false,
  569. refund_type: '',
  570. formLabelWidth: '120px',
  571. refundForm:{
  572. refund_price:'',
  573. refund_remark:'',
  574. },
  575. goods: {},
  576. refund_status_list: {}
  577. };
  578. },
  579. created() {
  580. this.id = getQuery('id');
  581. },
  582. mounted() {
  583. this.getDetail();
  584. },
  585. methods: {
  586. handleShipping(data) {
  587. this.handle('send_address', data, null, true);
  588. },
  589. selectAddress(data) {
  590. this.handle('select_address', data);
  591. },
  592. getDetail() {
  593. let self = this;
  594. self.cardLoading = true;
  595. request({
  596. params: {
  597. r: 'mall/order/refund-detail',
  598. id: self.id
  599. },
  600. method: 'get',
  601. }).then(e => {
  602. self.cardLoading = false;
  603. if (e.data.code == 0) {
  604. var data = e.data.data;
  605. self.orderDetail = data.refund;
  606. self.orderGoods = data.refund.orderDetail;
  607. self.orderGoodsList = [data.refund.orderDetail];
  608. self.address_list = data.address_list;
  609. self.stepText = data.step_text;
  610. self.default_address = data.address_list[0];
  611. self.feedback_type_list = data.feedback_type_list;
  612. self.step_status = self.orderDetail.step[0].step_status;
  613. self.is_show_revoce = data.is_show_revoce
  614. self.goods = data.goods
  615. self.refund_status_list = data.refund_status_list
  616. self.payment_type_list = data.payment_type_list
  617. self.q_refund = data.q_refund
  618. if (!isEmpty(data.step_arr)) self.getStepArr(data.step_arr, data.refund.step);
  619. } else {
  620. self.$message.error(e.data.msg);
  621. }
  622. }).catch(e => {
  623. console.log(e);
  624. });
  625. },
  626. getStepArr(stepArr, order) {
  627. var stepNumArr = [];
  628. var last_num = order[0].step_num;
  629. order.forEach(function (item) {
  630. stepNumArr[item.step_num] = item.created_at;
  631. });
  632. var newStepArr = [];
  633. stepArr.forEach(function (item) {
  634. let step = {};
  635. step['title'] = item.title;
  636. step['is_step'] = 1;
  637. if (stepNumArr[item.step_num]) {
  638. step['created_at'] = stepNumArr[item.step_num];
  639. } else if (last_num >= item.step_num && stepNumArr[last_num]) {// 如果一步到完成则获取最后一条时间
  640. console.info(last_num+'--'+item.step_num,'123')
  641. step['created_at'] = stepNumArr[last_num];
  642. } else {
  643. step['created_at'] = 0;
  644. step['is_step'] = 0;
  645. }
  646. newStepArr.push(step);
  647. });
  648. this.stepArrActive = this.orderDetail.step[0].step_num;
  649. // if (this.goods.goods_source === 'QiJuhe' && [0,1].indexOf(this.orderDetail.refund_status) === -1) {
  650. // newStepArr[1].title = this.refund_status_list[this.orderDetail.refund_status]
  651. // }
  652. this.stepArr = newStepArr;
  653. },
  654. handle(type, data, step_status = null, submit = false) {
  655. let id = data ? parseInt(data.id) : '';
  656. switch (type) {
  657. // 订单详情
  658. case 'detail':
  659. let params = {
  660. r: 'mall/order/detail'
  661. };
  662. if (id) params = Object.assign(params, {
  663. id: id
  664. });
  665. navigateTo(params);
  666. break;
  667. // 删除订单
  668. case 'destroy':
  669. param = {
  670. id: data.id,
  671. type
  672. };
  673. this.$confirm('删除该条数据后不可以恢复, 是否继续?', '警告', {
  674. type: 'warning'
  675. }).then(() => {
  676. this.send(param)
  677. }).catch((err) => {})
  678. break;
  679. // 售后处理
  680. case 'handle':
  681. param = {
  682. 'id': id,
  683. 'step_status': step_status,
  684. };
  685. this.id = id;
  686. this.step_status = step_status;
  687. switch (step_status){
  688. case 6:
  689. this.refund_type = '仅退款'
  690. this.showRefundForm();
  691. return
  692. }
  693. if (step_status < 0) {// 拒绝操作
  694. this.dialogVisible = true;
  695. this.temp_param = param
  696. } else {
  697. this.send('mall/order/handle-refund', param);
  698. }
  699. break;
  700. case 'exchange':// 换货
  701. case 'send_address':// 发送退货地址
  702. if (submit) {
  703. this.changeShippingLoading = true;
  704. this.send('mall/order/handle-refund', data, (resp) => {
  705. if (resp.code == 0) this.isShowChangeShipping = false;
  706. });
  707. setTimeout(() => {
  708. this.changeShippingLoading = false;
  709. }, 100);
  710. } else {
  711. this.isShowChangeShipping = true
  712. this.handleStepStatus = step_status;
  713. this.handleType = type;
  714. }
  715. break;
  716. //选择优惠券
  717. case 'select_address':
  718. for(let i = 0; i < this.address_list.length; i++) {
  719. if (this.address_list[i]['address'] == data) {
  720. this.default_address = this.address_list[i];
  721. }
  722. }
  723. break;
  724. case 'refuse':
  725. let refuse_param = Object.assign(this.temp_param, {
  726. 'refund_reason': this.refund_reason
  727. });
  728. console.log(refuse_param)
  729. this.send('mall/order/handle-refund', refuse_param, (resp) => {
  730. if (resp.code == 0) this.handleClose();
  731. });
  732. break;
  733. }
  734. },
  735. send(url, params, callback) {
  736. let self = this;
  737. request({
  738. params: {
  739. r: url,
  740. },
  741. method: 'post',
  742. data: params
  743. }).then(e => {
  744. if (e.data.code == 0) {
  745. self.$message.success(e.data.msg);
  746. self.getDetail();
  747. } else {
  748. self.$message.error(e.data.msg);
  749. }
  750. if (callback) callback(e.data);
  751. }).catch(e => {
  752. console.log(e);
  753. });
  754. },
  755. getOrderPrice(data){
  756. let text = '';
  757. switch (data.marketing_type) {
  758. case 'ScoreMall' :
  759. text = data.extra_info;
  760. break;
  761. default :
  762. text = '¥'+data.goods_price;
  763. }
  764. return text;
  765. },
  766. refundTakeDelivery(id){
  767. this.send('mall/order/refund-take-delivery', {'id':id});
  768. },
  769. handleClose() {
  770. this.refund_reason = ''
  771. this.dialogVisible = false
  772. this.temp_param = {}
  773. this.step_status = 5
  774. },
  775. // 退货超期,撤销售后
  776. revoceRefund(id) {
  777. this.$confirm('是否确认撤销售后, 是否继续?', '警告', {
  778. type: 'warning'
  779. }).then(() => {
  780. this.btnLoading = true
  781. request({
  782. params: {
  783. r: 'mall/order/revoce-refund',
  784. id: id
  785. },
  786. method: 'get',
  787. }).then(e => {
  788. if (e.data.code == 0) {
  789. this.btnLoading = false
  790. this.$message.success(e.data.msg);
  791. // setTimeout(() => {
  792. // navigateTo({
  793. // r: 'mall/order/refund',
  794. // });
  795. // }, 1500)
  796. this.getDetail();
  797. } else {
  798. this.btnLoading = false
  799. this.$message.error(e.data.msg);
  800. }
  801. })
  802. })
  803. },
  804. showRefundForm(){
  805. this.dialogFormVisibleRefund = true;
  806. this.refundForm.refund_price = this.orderDetail.refund_price;
  807. },
  808. closeRefundForm(){
  809. this.step_status = 5;
  810. this.dialogFormVisibleRefund = false;
  811. },
  812. handleRefund(){
  813. this.refundForm.id = this.id;
  814. this.refundForm.step_status = this.step_status;
  815. this.refundForm.refund_price = Number(this.refundForm.refund_price).toFixed(2);
  816. this.send('mall/order/handle-refund', this.refundForm);
  817. this.dialogFormVisibleRefund = false;
  818. },
  819. }
  820. });
  821. </script>