選択できるのは25トピックまでです。 トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。

apply-return-goods.vue 5.7KB

1年前
1年前
11ヶ月前
1年前
11ヶ月前
1年前
1年前
1年前
1年前
1年前
1年前
1年前
1年前
1年前
1年前
1年前
11ヶ月前
1年前
1年前
1年前
1年前
1年前
1年前
1年前
1年前
11ヶ月前
1年前
1年前
1年前
1年前
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259
  1. <!-- 申请退货 -->
  2. <template>
  3. <view class="box">
  4. <form-builder :config="config" :formData="state.formData" @submit="submit" @radioChange="radioChange" />
  5. </view>
  6. </template>
  7. <script setup lang="ts">
  8. import { reactive } from "vue";
  9. import { onLoad } from "@dcloudio/uni-app";
  10. import { msg, confirm, getOrderStatusName } from "@/utils/utils";
  11. import { request } from "@/utils/network/request";
  12. import { getLogistics, orderReturn, outletList } from "@/utils/network/api";
  13. import { stringToJson } from "@/utils/network/encryption";
  14. import { getItem, StorageKeys } from "@/utils/storage";
  15. import {
  16. getMailingAddress
  17. } from "@/subpackage/orders/js/publicRequest";
  18. const config = {
  19. submitName: "申请退货",
  20. titleWidth: 160,
  21. divider: true,
  22. address:""
  23. };
  24. const state = reactive({
  25. //订单信息
  26. orderInfo: {} as any,
  27. //退货类型: OFFLINE-线下 ON_LINE-线上
  28. returnMode: "ON_LINE",
  29. //网点列表
  30. outlets: [],
  31. //表单数据
  32. formData: [
  33. {
  34. title: "订单编号:",
  35. inputType: "number",
  36. type: 2,
  37. value: "id",
  38. hint: "订单编号",
  39. disabled: true,
  40. divider: true,
  41. },
  42. {
  43. title: "订单车牌号:",
  44. type: 2,
  45. value: "vehiclePlate",
  46. hint: "订单车牌号",
  47. disabled: true,
  48. divider: true,
  49. },
  50. {
  51. title: "订单状态:",
  52. type: 2,
  53. value: "orderStep",
  54. hint: "订单状态",
  55. disabled: true,
  56. divider: true,
  57. },
  58. {
  59. title: "退货方式:",
  60. type: 7,
  61. value: "returnMode",
  62. returnMode: "ON_LINE",
  63. star: true,
  64. required: true,
  65. divider: true,
  66. emptyHint: "请选择退货方式",
  67. itemData: [
  68. {
  69. checked: true,
  70. value: "ON_LINE",
  71. name: "线上",
  72. },
  73. // {
  74. // checked: false,
  75. // value: "OFFLINE",
  76. // name: "线下",
  77. // },
  78. ],
  79. },
  80. {
  81. title: "物流公司:",
  82. type: 4,
  83. value: "returnLogisticsCompany",
  84. required: true,
  85. star: true,
  86. hint: "请输入",
  87. divider: true,
  88. itemData: [],
  89. hide: false,
  90. emptyHint: "请选择物流公司",
  91. mode: "search",
  92. searchPickerVisible: false,
  93. },
  94. {
  95. title: "物流单号:",
  96. type: 2,
  97. value: "returnLogisticsNumber",
  98. required: true,
  99. maxlength: 20,
  100. hint: "请输入",
  101. emptyHint: "请输入物流单号",
  102. star: true,
  103. divider: true,
  104. hide: false,
  105. },
  106. {
  107. title: "退货网点编号:",
  108. type: 4,
  109. value: "returnNetworkName",
  110. required: true,
  111. star: true,
  112. hint: "请输入",
  113. emptyHint: "请选择退货网点",
  114. divider: true,
  115. itemData: [],
  116. hide: true,
  117. mode: "search",
  118. searchPickerVisible: false,
  119. },
  120. {
  121. title: "退货原因:",
  122. required: true,
  123. type: 5,
  124. vertical: 2,
  125. value: "returnReason",
  126. maxlength: 50,
  127. bg: true,
  128. star: true,
  129. hint: "请输入退货原因,限制50字以内",
  130. emptyHint: "请输入退货原因",
  131. },
  132. ],
  133. });
  134. /* 获取所有的快递公司 */
  135. const getLogisticsList = () => {
  136. const options = {
  137. type: 2,
  138. data: {},
  139. method: "POST",
  140. showLoading: true,
  141. };
  142. request(getLogistics, options).then((res) => {
  143. const data = stringToJson(res.bizContent);
  144. state.formData[4].itemData = data;
  145. });
  146. };
  147. /* 获取退货网点 */
  148. const getOutletList = () => {
  149. const options = {
  150. type: 2,
  151. data: {},
  152. method: "POST",
  153. showLoading: true,
  154. };
  155. request(outletList, options).then((res) => {
  156. state.outlets = stringToJson(res.bizContent);
  157. let nameList = [];
  158. state.outlets.map((item) => {
  159. nameList.push(item.name);
  160. });
  161. state.formData[6].itemData = nameList;
  162. });
  163. };
  164. //radio改变
  165. const radioChange = (e : any, item : any) => {
  166. if (item.value === "returnMode") {
  167. //退货方式
  168. state.returnMode = item.returnMode;
  169. state.formData[4].hide = state.returnMode === "ON_LINE" ? false : true;
  170. state.formData[5].hide = state.returnMode === "ON_LINE" ? false : true;
  171. state.formData[6].hide = state.returnMode === "ON_LINE" ? true : false;
  172. }
  173. };
  174. //提交退货申请
  175. const submit = (e : any) => {
  176. confirm(
  177. "是否确认退货?",
  178. () => {
  179. const curOutlet = state.outlets.find(
  180. (out) => out.name === e.returnNetworkName
  181. );
  182. const options = {
  183. type: 2,
  184. data: {
  185. id: state.orderInfo.id,
  186. returnMode: e.returnMode,
  187. // returnNetworkId: curOutlet == null ? "" : curOutlet.servicehallId,
  188. returnNetworkId: e.returnNetworkName,
  189. returnNetworkName: e.returnNetworkName,
  190. returnLogisticsCompany: e.returnLogisticsCompany,
  191. returnLogisticsNumber: e.returnLogisticsNumber,
  192. returnReason: e.returnReason,
  193. opId: getItem(StorageKeys.OpenId),
  194. address:config.address
  195. },
  196. method: "POST",
  197. showLoading: true,
  198. };
  199. request(orderReturn, options).then((res) => {
  200. confirm(
  201. "您申办的ETC订单已申请退货,待审核,请到【查询服务】的【业务审核查询】查看进度",
  202. () => {
  203. uni.$emit("refreshOrder");
  204. uni.switchTab({
  205. url: "/pages/order/order"
  206. })
  207. },
  208. "申请成功",
  209. false
  210. );
  211. });
  212. },
  213. "退货确认",
  214. true
  215. );
  216. };
  217. onLoad((option) => {
  218. state.orderInfo = JSON.parse(option.data);
  219. state.formData[0].hint = state.orderInfo.orderId;
  220. state.formData[1].hint = state.orderInfo.vehiclePlate;
  221. state.formData[2].hint = getOrderStatusName(state.orderInfo.orderStep);
  222. //获取物流公司
  223. getLogisticsList();
  224. //获取退货网点
  225. getOutletList();
  226. getMailingAddress(state.orderInfo.orderId).then((address) => {
  227. console.log("address",address)
  228. config.address=address
  229. })
  230. });
  231. </script>
  232. <style>
  233. page {
  234. background-color: #f3f3f3;
  235. padding-bottom: 30rpx;
  236. }
  237. </style>
  238. <style lang="scss" scoped>
  239. .box {
  240. margin: 20rpx 0rpx;
  241. background-color: white;
  242. padding: 0 20rpx 20rpx;
  243. }
  244. </style>