refundDetail.vue 36 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115
  1. <template>
  2. <div>
  3. <!-- 收退货仓库信息-->
  4. <el-card class="box-card" v-if="refundInfo.refundType == '3'">
  5. <el-select
  6. @change="handelChangeReturnWarehouse"
  7. v-model="selectedWarehouseCode"
  8. style="width: 60%"
  9. placeholder="The warehouse to receive return goods"
  10. :disabled="action != 'cus_check'"
  11. >
  12. <el-option
  13. v-for="warehouse in wareHouses"
  14. :key="warehouse.returnWarehouseCode"
  15. :label="warehouse.returnWarehouseName"
  16. :value="warehouse.returnWarehouseCode"
  17. >
  18. </el-option>
  19. </el-select>
  20. <el-divider></el-divider>
  21. <div>
  22. AddressInfo: {{ returnWarehouseAddress
  23. }}<i
  24. style="color:blue;"
  25. class="el-icon-document-copy"
  26. :title="$t('title.copy')"
  27. :copy-value="returnWarehouseAddress"
  28. v-on:click="copy"
  29. ></i>
  30. </div>
  31. </el-card>
  32. <el-card
  33. class="box-card"
  34. v-if="refundInfo.status == 0"
  35. v-loading="btnLoading"
  36. >
  37. <!-- TODO 暂时关闭SL -->
  38. <el-form
  39. v-if="refundInfo.refundType == '3' &&
  40. this.isShopifyLabel == true && addressInfo.receiverCountryName == 'US'"
  41. label-width="120px"
  42. >
  43. <el-form-item label="ShippingLabel">
  44. <el-radio-group v-model="slUseAble">
  45. <el-radio label="0">{{ $t("view.notEnabled") }}</el-radio>
  46. <el-radio label="1">{{ $t("view.enabled") }}</el-radio>
  47. </el-radio-group>
  48. <el-tag
  49. type="danger"
  50. v-if="this.slUseAble === '1' && this.shippingLabelMessage"
  51. >{{ this.shippingLabelMessage }}</el-tag
  52. >
  53. </el-form-item>
  54. </el-form>
  55. <!-- 审核-->
  56. <el-input
  57. type="textarea"
  58. :placeholder="$t('place.customerServiceRemarks')"
  59. v-model="checkData.notes"
  60. maxlength="150"
  61. :disabled="action != 'cus_check'"
  62. show-word-limit
  63. ></el-input>
  64. <!-- <el-select
  65. :placeholder="$t('place.rejectionReason')"
  66. clearable
  67. style="width: 530px;margin-top:20px;"
  68. class="filter-item"
  69. :disabled="action != 'cus_check'"
  70. v-model="checkData.rejectReason"
  71. >
  72. <el-option
  73. v-for="item in refundReasons"
  74. :key="item.id"
  75. :label="item.reasonContentChinese"
  76. :value="item.id"
  77. >
  78. </el-option>
  79. </el-select> -->
  80. <div
  81. style="float:right;margin-top:20px;margin-bottom:20px;"
  82. :style="hideStyleBtn"
  83. v-if="action == 'cus_check'"
  84. >
  85. <el-button type="primary" size="mini" @click="handleKfCheck(1)">{{
  86. $t("view.approved")
  87. }}</el-button>
  88. <el-button type="primary" size="mini" @click="handleKfCheck(2)">{{
  89. $t("view.rejected")
  90. }}</el-button>
  91. </div>
  92. </el-card>
  93. <el-card
  94. class="box-card"
  95. v-if="refundInfo.status == 5"
  96. v-loading="btnLoading"
  97. >
  98. <!-- 审核-->
  99. <el-form
  100. v-if="action == 'f_check'"
  101. ref="cwForm"
  102. :model="refundInfo"
  103. label-width="80px"
  104. >
  105. <el-form-item :label="$t('label.refundMethod')">
  106. <el-radio-group v-model="refundInfo.refundMethod" >
  107. <el-radio label="system">{{ $t("view.systemRefund") }}</el-radio>
  108. <el-radio label="manual">{{ $t("view.manualRefund") }}</el-radio>
  109. </el-radio-group>
  110. </el-form-item>
  111. <el-form-item
  112. v-if="refundInfo.refundMethod == 'manual'"
  113. :label="$t('label.accountType')"
  114. >
  115. <el-radio-group
  116. v-model="refundInfo.refundAccountType"
  117. >
  118. <el-radio label="PayPal">PayPal</el-radio>
  119. <el-radio label="bankCard">银行卡</el-radio>
  120. <el-radio label="Gift Card">Gift Card</el-radio>
  121. </el-radio-group>
  122. </el-form-item>
  123. <el-form-item
  124. v-if="
  125. refundInfo.refundMethod == 'manual' &&
  126. refundInfo.refundAccountType == 'PayPal'
  127. "
  128. :label="$t('label.refundAccount')"
  129. >
  130. <el-input
  131. v-model="refundInfo.refundAccount"
  132. :placeholder="$t('place.pleaseEnterRefundAccount')"
  133. >
  134. </el-input>
  135. </el-form-item>
  136. <!-- <el-form-item
  137. v-if="refundInfo.refundMethod == 'system'"
  138. :label="$t('label.rejectionOfReturns')"
  139. >
  140. <el-radio-group v-model="refundInfo.rejectedGoods">
  141. <el-radio label="false">{{ $t("label.no") }}</el-radio>
  142. <el-radio label="true">{{ $t("label.yes") }}</el-radio>
  143. </el-radio-group>
  144. </el-form-item> -->
  145. <el-form-item
  146. v-if="
  147. refundInfo.refundMethod == 'system' &&
  148. refundInfo.rejectedGoods == 'true'
  149. "
  150. :label="$t('label.rejectionReason')"
  151. >
  152. <el-select
  153. :placeholder="$t('place.rejectionReason')"
  154. clearable
  155. style="width: 200px;"
  156. class="filter-item"
  157. :disabled="action != 'f_check'"
  158. v-model="refundInfo.rejectReason"
  159. >
  160. <el-option
  161. v-for="item in refundReasons"
  162. :key="item.id"
  163. :label="item.reasonContentChinese"
  164. :value="item.id"
  165. >
  166. </el-option>
  167. </el-select>
  168. </el-form-item>
  169. </el-form>
  170. <el-input
  171. v-if="action == 'f_check'"
  172. type="textarea"
  173. :placeholder="$t('place.financeAuditRemarks')"
  174. v-model="checkData.cwnotes"
  175. maxlength="150"
  176. :disabled="btndisableed"
  177. show-word-limit
  178. ></el-input>
  179. <div
  180. style="float:right;margin-top:20px;margin-bottom:20px;"
  181. :style="hideStyleBtn"
  182. v-if="action == 'f_check'"
  183. >
  184. <el-button
  185. type="success"
  186. size="mini"
  187. v-if="
  188. refundInfo.channelCode == 'SHOPIFY' &&
  189. refundInfo.refundMethod == 'system'
  190. "
  191. @click="handleCalculatesCheck"
  192. style="margin-right:20px;"
  193. >{{ $t("view.verification") }}</el-button
  194. >
  195. <el-button
  196. type="primary"
  197. size="mini"
  198. :disabled="
  199. refundInfo.channelCode == 'SHOPIFY' &&
  200. btndisabled &&
  201. refundInfo.refundMethod == 'system'
  202. "
  203. @click="handleCheck(6)"
  204. >{{ $t("view.approved") }}</el-button
  205. >
  206. <el-button type="primary" size="mini" @click="handleCheck(0)">{{
  207. $t("view.rejected")
  208. }}</el-button>
  209. </div>
  210. </el-card>
  211. <el-card class="box-card">
  212. <!-- 基本信息-->
  213. <el-descriptions
  214. :title="$t('title.basicInformation')"
  215. :colon="false"
  216. border
  217. >
  218. <el-descriptions-item :label="$t('label.refundOrderNumber')"
  219. >{{ refundInfo.refundNo }}
  220. <i
  221. style="color:blue;"
  222. class="el-icon-document-copy"
  223. :title="$t('title.copy')"
  224. :copy-value="refundInfo.refundNo"
  225. v-on:click="copy"
  226. ></i
  227. ></el-descriptions-item>
  228. <el-descriptions-item :label="$t('label.totalRefundAmount')">{{
  229. refundInfo.refundAmount
  230. }}</el-descriptions-item>
  231. <el-descriptions-item :label="$t('label.SLFee')" span="1">
  232. {{ refundInfo.slFee || '0.00'}}
  233. </el-descriptions-item>
  234. <el-descriptions-item :label="$t('label.onlineShopOrder')"
  235. >{{ refundInfo.ormorder }}
  236. <i
  237. style="color:blue;"
  238. class="el-icon-document-copy"
  239. :title="$t('title.copy')"
  240. :copy-value="refundInfo.ormorder"
  241. v-on:click="copy"
  242. ></i
  243. ></el-descriptions-item>
  244. <!-- 添加shopify单号-->
  245. <el-descriptions-item label="实际退款金额">{{
  246. refundInfo.actualRefundAmount
  247. }}</el-descriptions-item>
  248. <el-descriptions-item :label="$t('label.shopifyNumber')" span="2"
  249. >{{ refundInfo.cutUser }}
  250. <i
  251. style="color:blue;"
  252. class="el-icon-document-copy"
  253. :title="$t('title.copy')"
  254. :copy-value="refundInfo.cutUser"
  255. v-on:click="copy"
  256. ></i
  257. ></el-descriptions-item>
  258. <el-descriptions-item :label="$t('label.afterSalesType')">{{
  259. refundInfo.refundType | refundTypeFilter(that)
  260. }}</el-descriptions-item>
  261. <!-- <el-descriptions-item label="退款原因(中文)" span="2">{{
  262. refundInfo.reasonContentChinese
  263. }}</el-descriptions-item>
  264. <el-descriptions-item label="退款原因(English)" span="1">{{
  265. refundInfo.reasonContentEnglish
  266. }}</el-descriptions-item>
  267. <el-descriptions-item
  268. v-if="refundInfo.otherReason"
  269. label="其他原因说明"
  270. span="3">{{
  271. refundInfo.otherReason
  272. }}</el-descriptions-item> -->
  273. <el-descriptions-item
  274. :label="$t('label.receivingReturnWarehouse')"
  275. span="1"
  276. v-if="refundInfo.warehouseName"
  277. >
  278. {{ refundInfo.warehouseName }}
  279. </el-descriptions-item>
  280. <el-descriptions-item
  281. :label="$t('label.warehouseReceivingStatus')"
  282. span="1"
  283. v-if="refundInfo.warehouseName"
  284. >
  285. {{ refundInfo.warehouseReceivingStatus }}
  286. </el-descriptions-item>
  287. <el-descriptions-item
  288. :label="$t('label.returnLogisticsCompany')"
  289. v-if="refundInfo.shipmodeId"
  290. >{{ refundInfo.shipmodeId }}</el-descriptions-item
  291. >
  292. <el-descriptions-item
  293. :label="$t('label.returnExpressNumber')"
  294. v-if="refundInfo.shippingNo"
  295. >{{ refundInfo.shippingNo
  296. }}<i
  297. style="color:blue;"
  298. v-if="refundInfo.shippingNo"
  299. class="el-icon-document-copy"
  300. :title="$t('title.copy')"
  301. :copy-value="refundInfo.shippingNo"
  302. v-on:click="copy"
  303. ></i
  304. ></el-descriptions-item>
  305. <el-descriptions-item
  306. :label="$t('label.customerServiceNote')"
  307. span="3"
  308. >{{ refundInfo.notes }}</el-descriptions-item
  309. >
  310. <el-descriptions-item :label="$t('label.buyersNote')" span="1">{{
  311. refundInfo.buyNotes
  312. }}</el-descriptions-item>
  313. <el-descriptions-item
  314. :label="$t('label.customerReturnCountry')"
  315. span="2"
  316. >{{ addressInfo.receiverCountryName }}</el-descriptions-item
  317. >
  318. <el-descriptions-item :label="$t('label.refundMethod')" span="1">
  319. {{ refundInfo.refundMethod | refundMethodFilter(that) }}
  320. </el-descriptions-item>
  321. <el-descriptions-item :label="$t('label.accountType')" span="2">
  322. {{ refundInfo.refundAccountType | refundAccountTypeFilter(that) }}
  323. </el-descriptions-item>
  324. <el-descriptions-item :label="$t('label.refundAccount')" span="2">
  325. {{ refundInfo.refundAccount }}
  326. </el-descriptions-item>
  327. <el-descriptions-item :label="$t('label.isSelfPickupOrder')" span="1">
  328. <span v-if="refundInfo.isSelfPickupOrder === false">{{ $t("no") }}</span>
  329. <span v-else>{{ $t("yes") }}</span>
  330. </el-descriptions-item>
  331. <!-- TODO 暂时关闭SL -->
  332. <el-descriptions-item :label="$t('label.openShippingLabel')" span="1">
  333. {{ refundInfo.slUseable | SlstatusFilter }}
  334. </el-descriptions-item>
  335. <el-descriptions-item :label="$t('label.useShippingLabel')" span="2">
  336. {{ refundInfo.slFlag | SlstatusFilter }}
  337. </el-descriptions-item>
  338. <el-descriptions-item :label="$t('label.shippingRefundAmount')" span="1">
  339. {{refundInfo.refundPostageAmount}}
  340. </el-descriptions-item>
  341. <el-descriptions-item :label="$t('label.sumGiftCardRefundAmount')" span="1">
  342. {{refundInfo.sumGiftCardRefundAmount}}
  343. </el-descriptions-item>
  344. <el-descriptions-item :label="$t('label.sumAiGiftCardRefundAmount')" span="1">
  345. {{refundInfo.sumAiGiftCardRefundAmount}}
  346. </el-descriptions-item>
  347. </el-descriptions>
  348. </el-card>
  349. <!--
  350. <el-divider><i class="el-icon-magic-stick"></i></el-divider>
  351. -->
  352. <el-card class="box-card">
  353. <el-descriptions
  354. :title="$t('title.returnProducts') + '-' + (index + 1)"
  355. v-for="(item, index) in orderItemInfo"
  356. :key="index"
  357. :colon="false"
  358. :style="titleColor(item)"
  359. border
  360. >
  361. <el-descriptions-item :label="$t('label.isNoHeadFlag')" span="1">
  362. <span v-if="item.isHeadFlag == 1">
  363. </span>
  364. <span v-if="item.isHeadFlag == 0">
  365. </span>
  366. </el-descriptions-item>
  367. <el-descriptions-item :label="$t('label.noHeadFlag')" span="2">
  368. <span v-if="item.isHeadFlag == 1 ">
  369. {{item.ordersIdS}}
  370. </span>
  371. </el-descriptions-item>
  372. <el-descriptions-item :label="$t('label.uniqueCode')" span="3">{{
  373. item.uniqueCode
  374. }}</el-descriptions-item>
  375. <el-descriptions-item :label="$t('label.skuCode')"
  376. >{{ item.skuCode }}
  377. <i
  378. style="color:blue;"
  379. class="el-icon-document-copy"
  380. :title="$t('title.copy')"
  381. :copy-value="item.skuCode"
  382. v-on:click="copy"
  383. ></i
  384. ></el-descriptions-item>
  385. <el-descriptions-item :label="$t('label.shopifyNumber')" span="2"
  386. >{{ item.orderOnId }}
  387. <i
  388. style="color:blue;"
  389. class="el-icon-document-copy"
  390. :title="$t('title.copy')"
  391. :copy-value="item.orderOnId"
  392. v-on:click="copy"
  393. ></i
  394. ></el-descriptions-item>
  395. <el-descriptions-item :label="$t('label.orderStatus')"
  396. >{{ item.orderStatus | statusFilterStatus }}
  397. </el-descriptions-item>
  398. <el-descriptions-item :label="$t('label.orderItemStatus')" span="2"
  399. >{{ item.itemStatus | statusFilterStatus }}
  400. </el-descriptions-item>
  401. <el-descriptions-item :label="$t('label.exchangeGoods')" span="1">
  402. {{ item.exchangeFlag === "1" ? $t("label.yes") : $t("label.no") }}
  403. </el-descriptions-item>
  404. <el-descriptions-item :label="$t('label.originalSKU')" span="2">
  405. {{ item.oldSku }}
  406. </el-descriptions-item>
  407. <el-descriptions-item :label="$t('label.productName')" span="2">{{
  408. item.productName
  409. }}</el-descriptions-item>
  410. <el-descriptions-item
  411. :label="$t('label.quantity')"
  412. labelStyle="color: red;"
  413. contentStyle="color: red;"
  414. v-if="item.quantity > 1"
  415. >{{ item.quantity }}
  416. </el-descriptions-item>
  417. <el-descriptions-item
  418. :label="$t('label.quantity')"
  419. v-if="item.quantity <= 1"
  420. >{{ item.quantity }}
  421. </el-descriptions-item>
  422. <el-descriptions-item :label="$t('label.refundSubtotal')">{{
  423. item.refundAmount
  424. }}</el-descriptions-item>
  425. <el-descriptions-item :label="$t('label.salePrice')">{{
  426. item.price
  427. }}</el-descriptions-item>
  428. <el-descriptions-item :label="$t('label.paymentAmount')"
  429. >{{ item.totalFee }}
  430. </el-descriptions-item>
  431. <el-descriptions-item :label="$t('label.discountAmount')">{{
  432. item.discountFee
  433. }}</el-descriptions-item>
  434. <el-descriptions-item :label="$t('label.sellerDiscount')">{{
  435. item.sellerDiscount
  436. }}</el-descriptions-item>
  437. <el-descriptions-item :label="$t('label.platformDiscount')">{{
  438. item.platformDiscount
  439. }}</el-descriptions-item>
  440. <el-descriptions-item :label="$t('label.loanAmount')" span="2">{{
  441. item.loanAmount
  442. }}</el-descriptions-item>
  443. <el-descriptions-item :label="$t('label.status')"
  444. >{{ item.returnStatus | statusFiltr2 }}
  445. </el-descriptions-item>
  446. <el-descriptions-item :label="$t('inboundStatus')">
  447. {{ item.inboundStatus | inboundStatusFilter }}
  448. </el-descriptions-item>
  449. <el-descriptions-item :label="$t('label.receivedGoodsType')">{{
  450. item.receiveType | receiveTypeFilter
  451. }}</el-descriptions-item>
  452. <el-descriptions-item :label="$t('label.currencyInformation')">{{
  453. refundInfo.currency
  454. }}</el-descriptions-item>
  455. <el-descriptions-item :label="$t('label.refundReason')">{{
  456. item.refundReason | reasonFilter(item.refundReasonList)
  457. }}</el-descriptions-item>
  458. <el-descriptions-item :label="$t('label.otherReasons')">{{
  459. item.otherReason
  460. }}</el-descriptions-item>
  461. </el-descriptions>
  462. </el-card>
  463. <!--
  464. <el-divider><i class="el-icon-magic-stick"></i></el-divider>
  465. -->
  466. <el-card class="box-card">
  467. <el-descriptions
  468. :title="$t('title.buyerInformation')"
  469. :colon="false"
  470. border
  471. >
  472. <el-descriptions-item :label="$t('country')" span="3">{{
  473. addressInfo.receiverCountryName
  474. }}</el-descriptions-item>
  475. <el-descriptions-item :label="$t('state')">{{
  476. addressInfo.receiverState
  477. }}</el-descriptions-item>
  478. <el-descriptions-item :label="$t('city')">{{
  479. addressInfo.receiverCity
  480. }}</el-descriptions-item>
  481. <el-descriptions-item :label="$t('suburb')">{{
  482. addressInfo.receiverDistrict
  483. }}</el-descriptions-item>
  484. <el-descriptions-item :label="$t('street')" span="3">{{
  485. addressInfo.receiverStreet
  486. }}</el-descriptions-item>
  487. <el-descriptions-item :label="$t('address')" span="3">{{
  488. addressInfo.receiverAddress
  489. }}</el-descriptions-item>
  490. <el-descriptions-item :label="$t('dooeNo')" span="2">{{
  491. addressInfo.receiverAddress2
  492. }}</el-descriptions-item>
  493. <el-descriptions-item :label="$t('recipient')">{{
  494. addressInfo.receiverName
  495. }}</el-descriptions-item>
  496. <el-descriptions-item :label="$t('telephone')" span="3"
  497. >{{ addressInfo.receiverPhone
  498. }}<i
  499. style="color:blue;"
  500. v-if="addressInfo.receiverPhone"
  501. class="el-icon-document-copy"
  502. :title="$t('title.copy')"
  503. :copy-value="addressInfo.receiverPhone"
  504. v-on:click="copy"
  505. ></i
  506. ></el-descriptions-item>
  507. <el-descriptions-item :label="$t('moPhone')" span="3"
  508. >{{ addressInfo.receiverMobile
  509. }}<i
  510. style="color:blue;"
  511. v-if="addressInfo.receiverMobile"
  512. class="el-icon-document-copy"
  513. :title="$t('title.copy')"
  514. :copy-value="addressInfo.receiverMobile"
  515. v-on:click="copy"
  516. ></i
  517. ></el-descriptions-item>
  518. <el-descriptions-item :label="$t('post')" span="3"
  519. >{{ addressInfo.email
  520. }}<i
  521. style="color:blue;"
  522. v-if="addressInfo.email"
  523. class="el-icon-document-copy"
  524. :title="$t('title.copy')"
  525. :copy-value="addressInfo.email"
  526. v-on:click="copy"
  527. ></i
  528. ></el-descriptions-item>
  529. <el-descriptions-item :label="$t('refundImg')" span="3">
  530. <el-image
  531. style="width: 40px; height: 40px"
  532. :src="refundInfo.annexPath"
  533. :preview-src-list="[refundInfo.annexPath]"
  534. >
  535. <div slot="error" class="image-slot">
  536. <i class="el-icon-picture-outline"></i>
  537. </div>
  538. </el-image>
  539. </el-descriptions-item>
  540. </el-descriptions>
  541. </el-card>
  542. <!--
  543. <el-divider><i class="el-icon-magic-stick"></i></el-divider>
  544. -->
  545. <el-card class="box-card">
  546. <el-descriptions :title="$t('title.operationLog')"> </el-descriptions>
  547. <el-timeline>
  548. <el-timeline-item
  549. type="primary"
  550. v-for="(log, index) in logs"
  551. :key="index"
  552. :timestamp="log.timeplaced"
  553. >
  554. {{ log.userName }} : {{ log.statusNotes }}
  555. </el-timeline-item>
  556. </el-timeline>
  557. </el-card>
  558. </div>
  559. </template>
  560. <script>
  561. import { handleClipboard } from "@/api/oms/copy";
  562. import {
  563. getRefundInfo,
  564. checkRefundCalculates,
  565. checkCw,
  566. checkKf,
  567. queryShippingAmount
  568. } from "@/api/oms/refund/refund";
  569. import { fetchList as reasonList } from "@/api/oms/refund/refundReason";
  570. import global from "@/views/oms/global";
  571. import { queryByOrdersId, queryByOrmorder } from "@/api/oms/order/address";
  572. import { returnWarehouseList } from "@/api/oms/inventory/warehouse";
  573. import { statusKeyValue } from "@/api/oms/order/order";
  574. import i18n from "@/lang";
  575. import { red } from "stylus/lib/functions";
  576. const refundMethodOptions = [
  577. { key: "system", display_name: "view.systemRefund" },
  578. { key: "manual", display_name: "view.manualRefund" }
  579. ];
  580. const refundMethodKeyValue = refundMethodOptions.reduce((acc, cur) => {
  581. acc[cur.key] = cur.display_name;
  582. return acc;
  583. }, {});
  584. const refundAccountTypeOptions = [
  585. { key: "PayPal", display_name: "PayPal" },
  586. { key: "bankCard", display_name: "view.bankCard" },
  587. { key: "other", display_name: "view.other" }
  588. ];
  589. const refundAccountTypeKeyValue = refundAccountTypeOptions.reduce(
  590. (acc, cur) => {
  591. acc[cur.key] = cur.display_name;
  592. return acc;
  593. },
  594. {}
  595. );
  596. export default {
  597. name: "refundInfoDialog",
  598. props: ["refundId", "action"],
  599. components: {},
  600. data() {
  601. return {
  602. that: this,
  603. active: 1,
  604. isShopifyLabel: false,
  605. activeName: "orderItemList",
  606. afterSaleStatusSuccess: global.afterSaleStatusSuccess,
  607. refundInfo: {},
  608. orderItemInfo: {},
  609. addressInfo: {},
  610. logs: [],
  611. checkData: {
  612. refundMethod: "system",
  613. rejectReason: "",
  614. notes: ""
  615. },
  616. btndisabled: true,
  617. btnLoading: false,
  618. successbtndisabled: false,
  619. hideStyleBtn: "",
  620. btndisableed: false,
  621. wareHouses: [], //收退货仓库列表
  622. selectedWarehouseCode: "",
  623. returnWarehouseAddress: "", //收退货的地址
  624. returnWcodeAndAddress: {},
  625. refundPriority: "",
  626. refundReasons: [],
  627. slUseAble: "0",
  628. shippingLabelMessage: "",
  629. showSlChooseLabel: 0 //是否展示选择使用sl标签 0 否 1 是
  630. };
  631. },
  632. filters: {
  633. refundAccountTypeFilter(key, that) {
  634. return that.$t(refundAccountTypeKeyValue[key]);
  635. },
  636. refundMethodFilter(key, that) {
  637. return that.$t(refundMethodKeyValue[key]);
  638. },
  639. statusFilterStatus(key) {
  640. return i18n.t(statusKeyValue[key]);
  641. },
  642. statusFilter(key) {
  643. var value = "";
  644. global.afterSaleStatus.forEach(status => {
  645. if (status.value == key) {
  646. value = status.label;
  647. }
  648. });
  649. return value;
  650. },
  651. refundTypeFilter(key,that) {
  652. var value = "";
  653. global.afterSaleType.forEach(refundType => {
  654. if (refundType.value == key) {
  655. value = that.$t(refundType.label);
  656. }
  657. });
  658. return value;
  659. },
  660. statusFiltr2(key) {
  661. var value = "";
  662. if(key != null){
  663. var keys = key.split(",");
  664. global.returnDeatilStatus.forEach(status => {
  665. for (var i = 0; i < keys.length; i++) {
  666. if (status.value == keys[i]) {
  667. value += status.label + ",";
  668. }
  669. }
  670. });
  671. }
  672. return value;
  673. },
  674. inboundStatusFilter(key) {
  675. var value = "";
  676. if(key != null){
  677. var keys = key.split(",");
  678. global.inboundStatus.forEach(type => {
  679. for (var i = 0; i < keys.length; i++) {
  680. if (type.value == keys[i]) {
  681. value += type.label + ",";
  682. }
  683. }
  684. });
  685. }
  686. return value;
  687. },
  688. reasonFilter(key, refundReasonList) {
  689. var value = "";
  690. refundReasonList.forEach(type => {
  691. if (type.id == key) {
  692. value = type.reasonContentChinese;
  693. }
  694. });
  695. return value;
  696. },
  697. receiveTypeFilter(key) {
  698. var value = "";
  699. if(key != null){
  700. var keys = key.split(",");
  701. global.receiveType.forEach(type => {
  702. for (var i = 0; i < keys.length; i++) {
  703. if (type.value == keys[i]) {
  704. value += type.label + ",";
  705. }
  706. }
  707. });
  708. }
  709. return value;
  710. },
  711. SlstatusFilter(key) {
  712. if (key == "1") {
  713. return "YES";
  714. } else if (key == "0") {
  715. return "NO";
  716. }
  717. },
  718. },
  719. created() {
  720. //获取退货详情信息
  721. this.initialization();
  722. //获取仓库列表
  723. // this.getReturnWarehouseList();
  724. },
  725. methods: {
  726. getRefundReasonList(type) {
  727. reasonList({ reasonType: type, limit: 1000 }).then(res => {
  728. if (200 == res.code) {
  729. this.refundReasons = res.data.list;
  730. }
  731. });
  732. },
  733. //选择物流公司编码,带出地址
  734. handelChangeReturnWarehouse() {
  735. if (this.selectedWarehouseCode !== "PSJ-H0000024"
  736. && this.selectedWarehouseCode !== "PSJ-H0000019"
  737. && this.selectedWarehouseCode !== "PSJ-H0000011"
  738. && this.selectedWarehouseCode !== "PSJ-G001001"
  739. && this.selectedWarehouseCode !== "PSJ-G001003"
  740. && this.selectedWarehouseCode !== "PSJ-G001004") {
  741. this.slUseAble = "0";
  742. this.showSlChooseLabel = 0; //展示sl的选择标签
  743. // 触发预估运费查询,目前只有一个仓库使用,可暂时不添加查询逻辑,后续若多仓库支持,则需要增加实时查询预估运费逻辑
  744. } else {
  745. this.slUseAble = "1";
  746. this.showSlChooseLabel = 1; //展示sl的选择标签
  747. }
  748. //TODO 暂时关闭SL
  749. this.slUseAble = "0";
  750. this.showSlChooseLabel = 1; //展示sl的选择标签
  751. this.returnWarehouseAddress = this.returnWcodeAndAddress[
  752. this.selectedWarehouseCode
  753. ];
  754. this.checkPSJWarehouse(this.returnWarehouseAddress, this.selectedWarehouseCode);
  755. },
  756. //获取退货仓库列表
  757. getReturnWarehouseList() {
  758. this.wareHouses = [];
  759. this.returnWcodeAndAddress = {};
  760. returnWarehouseList({'limit':1000}).then(res => {
  761. if (200 == res.code) {
  762. if (res.data.list != null && res.data.list.length > 0) {
  763. res.data.list.forEach(item1 => {
  764. var addressInfo =
  765. item1.contacts +
  766. " " +
  767. item1.countryCode +
  768. " " +
  769. item1.province +
  770. " " +
  771. item1.city +
  772. " " +
  773. item1.district +
  774. " " +
  775. item1.street +
  776. " " +
  777. item1.address1 +
  778. " " +
  779. item1.address2 +
  780. " " +
  781. item1.phoneNo +
  782. " " +
  783. item1.mobileNo +
  784. " " +
  785. item1.email;
  786. this.wareHouses.push(item1);
  787. this.returnWcodeAndAddress[
  788. item1.returnWarehouseCode
  789. ] = addressInfo;
  790. if (item1.returnWarehouseCode == this.refundInfo.warehouseCode) {
  791. this.selectedWarehouseCode = this.refundInfo.warehouseCode;
  792. this.returnWarehouseAddress = this.returnWcodeAndAddress[
  793. this.selectedWarehouseCode
  794. ];
  795. }
  796. });
  797. }
  798. //展示sl的选择标签
  799. this.checkPSJWarehouse(this.returnWarehouseAddress, this.selectedWarehouseCode);
  800. // TODO 暂时关闭SL
  801. // if (this.selectedWarehouseCode == "PSJ-H0000024") {
  802. // this.slUseAble = "1";
  803. // this.showSlChooseLabel = 1; //展示sl的选择标签
  804. // }
  805. }
  806. this.listLoading = false;
  807. });
  808. },
  809. //获取售后详情
  810. initialization() {
  811. getRefundInfo(this.refundId)
  812. .then(res => {
  813. if (200 == res.code) {
  814. this.refundInfo = res.data;
  815. this.orderItemInfo = res.data.items;
  816. this.logs = res.data.logItems;
  817. //获取收退货仓库列表
  818. this.getShippingLabelAmount(this.refundInfo, "");
  819. // this.getRefundReasonList(res.data.refundType);
  820. return Promise.resolve(res.data.ordersNo);
  821. }
  822. return Promise.reject();
  823. })
  824. .then(ordersId => {
  825. return queryByOrdersId(ordersId);
  826. })
  827. .then(res => {
  828. if (200 == res.code) {
  829. this.addressInfo = res.data;
  830. this.getReturnWarehouseList();
  831. if(this.addressInfo.receiverCountryCode == 'GB'){
  832. this.refundInfo.warehouseCode = 'PSJ-H0000044';
  833. this.selectedWarehouseCode = 'PSJ-H0000044';
  834. }
  835. if(this.addressInfo.receiverCountryCode == 'JP'){
  836. this.refundInfo.warehouseCode = 'JPNW01';
  837. this.selectedWarehouseCode = 'JPNW01';
  838. }
  839. if(this.addressInfo.receiverCountryCode == 'TW'){
  840. this.refundInfo.warehouseCode = 'G00886001';
  841. this.selectedWarehouseCode = 'G00886001';
  842. }
  843. if(this.addressInfo.receiverCountryCode == 'HK'){
  844. this.refundInfo.warehouseCode = 'HKW002';
  845. this.selectedWarehouseCode = 'HKW002';
  846. }
  847. }
  848. });
  849. },
  850. //复制
  851. copy(event) {
  852. var text = event.target.attributes["copy-value"].value;
  853. handleClipboard(text, event);
  854. },
  855. handleCheck(status) {
  856. this.btnLoading = true;
  857. this.btndisabled = true;
  858. let msg = "";
  859. if (status === 6) {
  860. msg = "确认审核通过?";
  861. } else {
  862. msg = "确认审核驳回?";
  863. }
  864. this.$confirm(msg, "提示", {
  865. confirmButtonText: "确定",
  866. cancelButtonText: "取消",
  867. type: "warning"
  868. })
  869. .then(() => {
  870. var params = {
  871. id: this.refundInfo.id,
  872. status: status,
  873. cwnotes: this.checkData.cwnotes,
  874. refundMethod: this.refundInfo.refundMethod,
  875. refundAccountType: this.refundInfo.refundAccountType,
  876. refundAccount: this.refundInfo.refundAccount,
  877. refundPriority: this.refundPriority
  878. };
  879. checkCw(params).then(
  880. res => {
  881. if (200 == res.code) {
  882. this.$message({
  883. message: "操作成功",
  884. type: "success"
  885. });
  886. this.hideStyleBtn = "display:none";
  887. this.btndisabled = false;
  888. this.btndisableed = true;
  889. this.btnLoading = false;
  890. this.$emit("refresh");
  891. }
  892. },
  893. error => {
  894. this.btnLoading = false;
  895. this.btndisabled = true;
  896. }
  897. );
  898. })
  899. .catch(() => {
  900. this.btnLoading = false;
  901. this.btndisabled = true;
  902. this.$message({
  903. type: "info",
  904. message: "已取消操作"
  905. });
  906. });
  907. },
  908. // 审核是否是派速捷仓库 美国地址
  909. checkPSJWarehouse(house, code){
  910. let shu = house.split(" ");
  911. if (this.addressInfo.receiverCountryCode == 'US' && (code == "PSJ-G001003" || code == "PSJ-G001001" || code == "PSJ-H0000024"
  912. || code == "PSJ-H0000019" || code == "PSJ-H0000011" || code == "PSJ-G001004")){
  913. this.isShopifyLabel = true;
  914. this.refundInfo.warehouseCode = code;
  915. this.slUseAble = "1";
  916. this.getShippingLabelAmount(this.refundInfo);
  917. }else{
  918. this.isShopifyLabel = false;
  919. }
  920. },
  921. //客服审核
  922. handleKfCheck(status) {
  923. this.btnLoading = true;
  924. this.btndisabled = true;
  925. let msg = "";
  926. if (status === 1) {
  927. msg = "确认审核通过?";
  928. } else {
  929. msg = "确认审核驳回?";
  930. }
  931. // if (this.slUseAble == "1") {
  932. // if (
  933. // this.refundInfo.shippingNo &&
  934. // this.refundInfo.shippingNo != "/" &&
  935. // (this.refundInfo.shipmodeId && this.refundInfo.shipmodeId != "/")
  936. // ) {
  937. // this.$message.error("当前退货物流信息已维护,无法使用SL渠道");
  938. // this.btnLoading = false;
  939. // this.btndisabled = false;
  940. // return;
  941. // }
  942. // }
  943. this.$confirm(msg, "提示", {
  944. confirmButtonText: "确定",
  945. cancelButtonText: "取消",
  946. type: "warning"
  947. })
  948. .then(() => {
  949. //如果是退货退款 客服审核且当前的仓库编码是空的提示让客服选择一个收退货仓库编码
  950. if (
  951. this.refundInfo.refundType == "3" &&
  952. !this.selectedWarehouseCode
  953. ) {
  954. this.$message({
  955. type: "info",
  956. message: "Please choose a warehouse to receive return goods"
  957. });
  958. return false;
  959. }
  960. var params = {
  961. id: this.refundInfo.id,
  962. status: status,
  963. rejectReason: this.checkData.rejectReason,
  964. notes: this.checkData.notes,
  965. warehouseCode: this.selectedWarehouseCode, //选择的收退货仓库编码
  966. // slUseable: this.slUseAble //是否使用SL
  967. slUseable: this.slUseAble //TODO 暂时关闭SL
  968. };
  969. checkKf(params).then(
  970. res => {
  971. if (200 == res.code) {
  972. this.$message({
  973. message: "操作成功",
  974. type: "success"
  975. });
  976. this.hideStyleBtn = "display:none";
  977. this.btndisabled = false;
  978. this.btndisableed = true;
  979. this.btnLoading = false;
  980. this.$emit("refresh");
  981. }
  982. },
  983. error => {
  984. this.btnLoading = false;
  985. this.btndisabled = true;
  986. }
  987. );
  988. })
  989. .catch(() => {
  990. this.btnLoading = false;
  991. this.btndisabled = true;
  992. this.$message({
  993. type: "info",
  994. message: "已取消操作"
  995. });
  996. });
  997. },
  998. handleCalculatesCheck() {
  999. this.btnLoading = true;
  1000. var params = {
  1001. id: this.refundInfo.id
  1002. };
  1003. checkRefundCalculates(params)
  1004. .then(
  1005. res => {
  1006. if (200 === res.code) {
  1007. if(res.msg==="exist"){
  1008. this.refundPriority="gift";
  1009. this.$confirm("当前订单存在礼品卡支付,执行退款将优先退还礼品卡金额", "温馨提示", {
  1010. confirmButtonText: "确认",
  1011. cancelButtonText: "关闭",
  1012. showCancelButton:false,
  1013. cancelButtonClass: 'btnCancel',
  1014. type: 'warning',
  1015. showClose:false
  1016. })
  1017. }else if(res.msg==="none"){
  1018. this.refundPriority="";
  1019. this.$confirm("当前售后没有可退款的支付流水,请您选择手工退款方式", "温馨提示", {
  1020. confirmButtonText: "确认",
  1021. cancelButtonText: "关闭",
  1022. showCancelButton:false,
  1023. cancelButtonClass: 'btnCancel',
  1024. type: 'warning',
  1025. showClose:false
  1026. })
  1027. }else{
  1028. this.refundPriority="";
  1029. }
  1030. this.$message({
  1031. message: "验证通过",
  1032. type: "success"
  1033. });
  1034. this.btnLoading = false;
  1035. this.btndisabled = false;
  1036. }
  1037. },
  1038. error => {
  1039. this.btnLoading = false;
  1040. this.btndisabled = true;
  1041. }
  1042. )
  1043. .catch(() => {
  1044. this.btnLoading = false;
  1045. this.btndisabled = true;
  1046. });
  1047. },
  1048. titleColor(item) {
  1049. if (item.quantity > 1) {
  1050. return "color: red !important;";
  1051. }
  1052. },
  1053. getShippingLabelAmount(refundInfo) {
  1054. if (refundInfo.refundType == "3" && this.selectedWarehouseCode) {
  1055. queryShippingAmount(refundInfo).then(res => {
  1056. if (201 == res.errorKey) {
  1057. this.shippingLabelMessage = res.msg;
  1058. } else if (200 == res.code) {
  1059. this.shippingLabelMessage =
  1060. "当前退款金额为" +
  1061. refundInfo.refundAmount +
  1062. ",开启后退款金额为" +
  1063. res.shippingLabelAmount;
  1064. }
  1065. });
  1066. }
  1067. }
  1068. }
  1069. };
  1070. </script>
  1071. <style lang="scss">
  1072. //.btnCancel{
  1073. // float: right;
  1074. // margin-left: 10px;
  1075. // color: #fff !important;
  1076. // background-color: #AE8877 !important;
  1077. // border-color: #AE8877 !important;
  1078. //}
  1079. //.btnCancel:hover, .btnCancel:focus {
  1080. // background: #bea092 !important;
  1081. // border-color: #bea092 !important;
  1082. // color: #fff !important;
  1083. //}
  1084. </style>