logic.js 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419
  1. import { getMyOrders, cancelOrderApi } from '@/api/order/subOrder'
  2. import { listAllService } from '@/api/service/list'
  3. import customTabbar from '@/components/custom-tabbar/index.vue'
  4. export default {
  5. components: {
  6. customTabbar
  7. },
  8. data() {
  9. return {
  10. currentTab: 0,
  11. tabs: ['待接送/服务', '配送/服务中', '已完成', '已取消'],
  12. typeFilterOptions: ['全部类型'],
  13. currentTypeFilterIdx: 0,
  14. activeDropdown: 0,
  15. hasTimeFilter: false,
  16. currentMonth: '2026年2月',
  17. weekDays: ['日', '一', '二', '三', '四', '五', '六'],
  18. calendarDays: [],
  19. selectedDateRange: [],
  20. allOrderList: [],
  21. serviceList: [],
  22. searchContent: '',
  23. startServiceTime: '',
  24. endServiceTime: '',
  25. showPetModal: false,
  26. currentPetInfo: {},
  27. showNavModal: false,
  28. navTargetItem: null,
  29. navTargetPointType: '',
  30. activeCallItem: null,
  31. showRemarkInput: false,
  32. remarkText: ''
  33. }
  34. },
  35. created() {
  36. this.initCalendar();
  37. },
  38. async onLoad() {
  39. await this.loadServiceList()
  40. await this.loadOrders()
  41. },
  42. onShow() {
  43. uni.hideTabBar()
  44. // 此处不需要重复调用,因为逻辑可能在onLoad已处理,
  45. // 或者如果需要每次进入都刷新,可以保留,但需确保顺序
  46. this.loadOrders()
  47. },
  48. async onPullDownRefresh() {
  49. try {
  50. await this.loadServiceList()
  51. await this.loadOrders()
  52. } finally {
  53. uni.stopPullDownRefresh()
  54. }
  55. },
  56. watch: {
  57. currentTab() {
  58. this.loadOrders()
  59. },
  60. currentTypeFilterIdx() {
  61. this.loadOrders()
  62. },
  63. searchContent() {
  64. // 搜索内容变化时,自动重新加载订单
  65. this.loadOrders()
  66. }
  67. },
  68. computed: {
  69. orderList() {
  70. return this.allOrderList;
  71. }
  72. },
  73. methods: {
  74. async loadServiceList() {
  75. try {
  76. const res = await listAllService()
  77. this.serviceList = res.data || []
  78. this.typeFilterOptions = ['全部类型', ...this.serviceList.map(s => s.name)]
  79. } catch (err) {
  80. console.error('获取服务类型失败:', err)
  81. }
  82. },
  83. async loadOrders() {
  84. try {
  85. const statusMap = { 0: 2, 1: 3, 2: 4, 3: 5 }
  86. const serviceId = this.currentTypeFilterIdx > 0 ? this.serviceList[this.currentTypeFilterIdx - 1]?.id : undefined
  87. const params = {
  88. status: statusMap[this.currentTab],
  89. content: this.searchContent || undefined,
  90. service: serviceId,
  91. startServiceTime: this.startServiceTime || undefined,
  92. endServiceTime: this.endServiceTime || undefined
  93. }
  94. console.log('订单列表请求参数:', params)
  95. const res = await getMyOrders(params)
  96. console.log('订单列表响应:', res)
  97. const orders = res.rows || []
  98. console.log('订单数量:', orders.length)
  99. this.allOrderList = orders.map(order => this.transformOrder(order, this.currentTab))
  100. } catch (err) {
  101. console.error('获取订单列表失败:', err)
  102. this.allOrderList = []
  103. }
  104. },
  105. transformOrder(order, tabIndex) {
  106. const service = this.serviceList.find(s => s.id === order.service)
  107. const serviceText = service?.name || '未知'
  108. const serviceIcon = service?.iconUrl || ''
  109. const mode = service?.mode || 0
  110. const isRoundTrip = mode === 1
  111. // 根据 Tab 索引强制指定状态文字,忽略后端缺失的 status 字段
  112. let statusText = '接单'
  113. if (tabIndex === 0) {
  114. statusText = '接单' // 待接送/服务
  115. } else if (tabIndex === 1) {
  116. statusText = isRoundTrip ? '出发' : '开始' // 配送/服务中
  117. } else if (tabIndex === 2) {
  118. statusText = '已完成' // 已完成
  119. } else if (tabIndex === 3) {
  120. statusText = '已拒绝' // 已拒绝
  121. }
  122. return {
  123. id: order.id,
  124. status: order.status, // 保存原始 status 用于判断权限
  125. type: isRoundTrip ? 1 : 2,
  126. typeText: serviceText,
  127. typeIcon: serviceIcon,
  128. statusText: statusText,
  129. price: (order.price / 100).toFixed(2),
  130. timeLabel: '服务时间',
  131. time: order.serviceTime || '',
  132. petAvatar: order.petAvatar || '/static/dog.png',
  133. petAvatarUrl: order.petAvatarUrl || '',
  134. petName: order.petName || '',
  135. petBreed: order.breed || '',
  136. startLocation: order.fromAddress || '暂无起点',
  137. startAddress: order.fromAddress || '',
  138. fromAddress: order.fromAddress || '',
  139. fromLat: order.fromLat,
  140. fromLng: order.fromLng,
  141. startDistance: '0km',
  142. endLocation: (order.customerName || '') + ' ' + (order.customerPhone || ''),
  143. endAddress: order.toAddress || '',
  144. toAddress: order.toAddress || '',
  145. toLat: order.toLat,
  146. toLng: order.toLng,
  147. customerPhone: order.customerPhone || '',
  148. endDistance: '0km',
  149. serviceContent: order.remark || '',
  150. remark: order.remark || ''
  151. }
  152. },
  153. getDisplayStatus(item) {
  154. if (item.statusText === '已完成') return '已完成';
  155. if (item.statusText === '已拒绝') return '已拒绝';
  156. if (item.statusText === '接单') {
  157. return item.type === 1 ? '待接送' : '待服务';
  158. }
  159. return item.type === 1 ? '配送中' : '服务中';
  160. },
  161. getStatusClass(item) {
  162. let display = this.getDisplayStatus(item);
  163. if (display === '已完成') return 'finish';
  164. if (display === '已拒绝') return 'reject';
  165. if (display === '配送中' || display === '服务中') return 'processing';
  166. return 'highlight';
  167. },
  168. goToDetail(item) {
  169. uni.navigateTo({ url: `/pages/orders/detail?id=${item.id}` });
  170. },
  171. showPetProfile(item) {
  172. this.currentPetInfo = {
  173. ...item,
  174. petGender: 'M',
  175. petAge: '2岁',
  176. petWeight: '15kg',
  177. petPersonality: '活泼亲人,精力旺盛',
  178. petHobby: '喜欢追飞盘,爱吃肉干',
  179. petRemark: '肠胃较弱,不能乱喂零食;出门易爆冲,请拉紧牵引绳。',
  180. petTags: ['拉响警报', '不能吃鸡肉', '精力旺盛'],
  181. petLogs: [
  182. { date: '2026-02-09 14:00', content: '今天遛弯拉了两次粑粑,精神状态很好。', recorder: '王阿姨' },
  183. { date: '2026-02-08 10:30', content: '有些挑食,剩了小半碗狗粮。', recorder: '李师傅' },
  184. { date: '2026-02-05 09:00', content: '建档。', recorder: '系统记录' }
  185. ]
  186. };
  187. this.showPetModal = true;
  188. },
  189. closePetProfile() {
  190. this.showPetModal = false;
  191. },
  192. openNavigation(item, pointType) {
  193. this.navTargetItem = item;
  194. this.navTargetPointType = pointType;
  195. this.showNavModal = true;
  196. },
  197. closeNavModal() {
  198. this.showNavModal = false;
  199. },
  200. chooseMap(mapType) {
  201. let item = this.navTargetItem;
  202. let pointType = this.navTargetPointType;
  203. // 起 -> fromAddress ; 终 -> toAddress
  204. let name = pointType === 'start' ? (item.fromAddress || '起点') : (item.toAddress || '终点');
  205. let address = pointType === 'start' ? (item.fromAddress || '起点地址') : (item.toAddress || '终点地址');
  206. let latitude = pointType === 'start' ? Number(item.fromLat) : Number(item.toLat);
  207. let longitude = pointType === 'start' ? Number(item.fromLng) : Number(item.toLng);
  208. this.showNavModal = false;
  209. // 统一定义打开地图的函数
  210. const navigateTo = (lat, lng, addrName, addrDesc) => {
  211. uni.openLocation({
  212. latitude: lat,
  213. longitude: lng,
  214. name: addrName,
  215. address: addrDesc || '无法获取详细地址',
  216. success: function () {
  217. console.log('打开导航成功: ' + mapType);
  218. },
  219. fail: function (err) {
  220. console.error('打开导航失败:', err);
  221. uni.showToast({ title: '打开地图失败', icon: 'none' });
  222. }
  223. });
  224. };
  225. // 如果有目标经纬度,直接打开
  226. if (latitude && longitude && !isNaN(latitude) && !isNaN(longitude)) {
  227. navigateTo(latitude, longitude, name, address);
  228. } else {
  229. // 如果没有经纬度,按照需求:使用自己当前的经纬度,然后搜索 fromAddress 或者 toAddress
  230. uni.showLoading({ title: '获取当前位置...', mask: true });
  231. uni.getLocation({
  232. type: 'gcj02',
  233. success: (res) => {
  234. uni.hideLoading();
  235. // 使用用户当前经纬度作为锚点打开地图,展示目标地址信息
  236. navigateTo(res.latitude, res.longitude, name, address);
  237. },
  238. fail: (err) => {
  239. uni.hideLoading();
  240. console.error('获取地理位置失败:', err);
  241. uni.showToast({ title: '无法获取当前位置信息', icon: 'none' });
  242. }
  243. });
  244. }
  245. },
  246. toggleCallMenu(item) {
  247. if (this.activeCallItem === item) {
  248. this.activeCallItem = null;
  249. } else {
  250. this.activeCallItem = item;
  251. }
  252. },
  253. closeCallMenu() {
  254. this.activeCallItem = null;
  255. },
  256. doCall(type, item) {
  257. let phoneNum = ''
  258. const targetItem = item || this.activeCallItem
  259. if (type === 'merchant') {
  260. phoneNum = '18900008451'
  261. } else if (type === 'customer') {
  262. phoneNum = targetItem?.customerPhone || '13800000001'
  263. }
  264. if (phoneNum) {
  265. uni.makePhoneCall({ phoneNumber: phoneNum })
  266. }
  267. this.activeCallItem = null;
  268. },
  269. reportAbnormal(item) {
  270. uni.navigateTo({ url: '/pages/orders/anomaly?orderId=' + (item.id || '') });
  271. },
  272. toggleDropdown(idx) {
  273. if (this.activeDropdown === idx) {
  274. this.activeDropdown = 0;
  275. } else {
  276. this.activeDropdown = idx;
  277. }
  278. },
  279. closeDropdown() {
  280. this.activeDropdown = 0;
  281. },
  282. selectType(index) {
  283. this.currentTypeFilterIdx = index;
  284. this.closeDropdown();
  285. },
  286. initCalendar() {
  287. let days = [];
  288. for (let i = 1; i <= 28; i++) {
  289. days.push(i);
  290. }
  291. this.calendarDays = days;
  292. this.selectedDateRange = [2, 4];
  293. },
  294. prevMonth() { uni.showToast({ title: '上个月', icon: 'none' }); },
  295. nextMonth() { uni.showToast({ title: '下个月', icon: 'none' }); },
  296. selectDateItem(day) {
  297. if (this.selectedDateRange.length === 2) {
  298. this.selectedDateRange = [day];
  299. } else if (this.selectedDateRange.length === 1) {
  300. let start = this.selectedDateRange[0];
  301. if (day > start) {
  302. this.selectedDateRange = [start, day];
  303. } else if (day < start) {
  304. this.selectedDateRange = [day, start];
  305. } else {
  306. this.selectedDateRange = [];
  307. }
  308. } else {
  309. this.selectedDateRange = [day];
  310. }
  311. },
  312. getDateClass(day) {
  313. if (this.selectedDateRange.length === 0) return '';
  314. if (this.selectedDateRange.length === 1) {
  315. return day === this.selectedDateRange[0] ? 'is-start' : '';
  316. }
  317. let start = this.selectedDateRange[0];
  318. let end = this.selectedDateRange[1];
  319. if (day === start) return 'is-start';
  320. if (day === end) return 'is-end';
  321. if (day > start && day < end) return 'is-between';
  322. return '';
  323. },
  324. resetTimeFilter() {
  325. this.hasTimeFilter = false;
  326. this.selectedDateRange = [];
  327. this.startServiceTime = '';
  328. this.endServiceTime = '';
  329. this.closeDropdown();
  330. this.loadOrders();
  331. },
  332. confirmTimeFilter() {
  333. if (this.selectedDateRange.length === 0) {
  334. uni.showToast({ title: '请先选择日期', icon: 'none' });
  335. return;
  336. }
  337. // 构建时间范围参数
  338. const year = this.currentMonth.replace(/[^0-9]/g, '').substring(0, 4);
  339. const month = this.currentMonth.replace(/[^0-9]/g, '').substring(4);
  340. const pad = (n) => String(n).padStart(2, '0');
  341. if (this.selectedDateRange.length === 2) {
  342. this.startServiceTime = `${year}-${pad(month)}-${pad(this.selectedDateRange[0])} 00:00:00`;
  343. this.endServiceTime = `${year}-${pad(month)}-${pad(this.selectedDateRange[1])} 23:59:59`;
  344. } else {
  345. this.startServiceTime = `${year}-${pad(month)}-${pad(this.selectedDateRange[0])} 00:00:00`;
  346. this.endServiceTime = `${year}-${pad(month)}-${pad(this.selectedDateRange[0])} 23:59:59`;
  347. }
  348. this.hasTimeFilter = true;
  349. this.closeDropdown();
  350. this.loadOrders();
  351. },
  352. getMainActionText(item) {
  353. return '查看详情';
  354. },
  355. mainAction(item) {
  356. uni.navigateTo({ url: `/pages/orders/detail?id=${item.id}` });
  357. },
  358. openRemarkInput() {
  359. this.remarkText = '';
  360. this.showRemarkInput = true;
  361. },
  362. closeRemarkInput() {
  363. this.showRemarkInput = false;
  364. this.remarkText = '';
  365. },
  366. submitRemark() {
  367. const text = this.remarkText.trim();
  368. if (!text) {
  369. uni.showToast({ title: '备注内容不能为空', icon: 'none' });
  370. return;
  371. }
  372. const now = new Date();
  373. const dateStr = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}-${String(now.getDate()).padStart(2, '0')} ${String(now.getHours()).padStart(2, '0')}:${String(now.getMinutes()).padStart(2, '0')}`;
  374. if (!this.currentPetInfo.petLogs) {
  375. this.$set(this.currentPetInfo, 'petLogs', []);
  376. }
  377. this.currentPetInfo.petLogs.unshift({
  378. date: dateStr,
  379. content: text,
  380. recorder: '我'
  381. });
  382. uni.showToast({ title: '备注已添加', icon: 'success' });
  383. this.closeRemarkInput();
  384. },
  385. /**
  386. * 取消订单处理逻辑
  387. * @param {Object} item - 订单项
  388. */
  389. handleCancelOrder(item) {
  390. uni.showModal({
  391. title: '提示',
  392. content: '确认是否取消这个订单?',
  393. success: async (res) => {
  394. if (res.confirm) {
  395. try {
  396. uni.showLoading({ title: '取消中...', mask: true });
  397. await cancelOrderApi({ orderId: item.id });
  398. uni.showToast({ title: '订单已取消', icon: 'success' });
  399. // 延时刷新列表,防止提示框闪现
  400. setTimeout(() => {
  401. this.loadOrders();
  402. }, 1500);
  403. } catch (err) {
  404. console.error('取消订单失败:', err);
  405. uni.showToast({ title: '取消失败', icon: 'none' });
  406. } finally {
  407. uni.hideLoading();
  408. }
  409. }
  410. }
  411. });
  412. }
  413. }
  414. }