bad-off.vue 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207
  1. <template>
  2. <view class="container" @click="playGlobalSound">
  3. <!-- 任务列表 -->
  4. <view class="task-list">
  5. <template v-if="!loading">
  6. <view
  7. v-if="taskList.length > 0"
  8. v-for="(item, index) in taskList"
  9. :key="index"
  10. class="task-card"
  11. @click="handleTaskClick(item)"
  12. >
  13. <view class="task-header">
  14. <text class="task-no">作业单号:{{ item.taskCode }}</text>
  15. </view>
  16. <view class="task-content">
  17. <view class="flex-a mb-10">
  18. <text class="label">仓库:</text>
  19. <text class="value">{{ item.godownName }}</text>
  20. </view>
  21. <view class="flex-a mb-10">
  22. <text class="label">订单数量:</text>
  23. <text class="value">{{ item.orderNum }}</text>
  24. </view>
  25. <view class="flex-a mb-10">
  26. <text class="label">创建时间:</text>
  27. <text class="value">{{ item.createTime }}</text>
  28. </view>
  29. <view class="flex-a">
  30. <text class="label">作业状态:</text>
  31. <text class="value">{{ getTaskStatusText(item.taskStatus) }}</text>
  32. </view>
  33. </view>
  34. </view>
  35. <view v-else class="empty-state">
  36. <text>暂无任务数据</text>
  37. </view>
  38. </template>
  39. <view v-else class="loading-state">
  40. <u-loading-icon></u-loading-icon>
  41. <text>加载中...</text>
  42. </view>
  43. </view>
  44. </view>
  45. </template>
  46. <script setup>
  47. import { ref, onMounted } from "vue";
  48. // 搜索文本
  49. const searchText = ref("");
  50. // 点击全局音效
  51. function playGlobalSound(){
  52. uni.$u.playClickSound()
  53. }
  54. // 任务列表数据
  55. const taskList = ref([]);
  56. // 加载状态
  57. const loading = ref(false);
  58. // 作业状态枚举
  59. const taskStatusEnum = {
  60. 1: "待作业",
  61. 2: "作业中",
  62. 3: "已完成",
  63. 4: "已关闭",
  64. };
  65. // 获取状态文本
  66. const getTaskStatusText = (status) => {
  67. return taskStatusEnum[status] || "未知状态";
  68. };
  69. // 获取任务列表
  70. const fetchTaskList = async () => {
  71. loading.value = true;
  72. try {
  73. const response = await uni.$u.http.post("/app/appstock/getNeedStockList");
  74. console.log(response);
  75. taskList.value = response;
  76. if (response.code === 200) {
  77. taskList.value = response.data || [];
  78. } else {
  79. uni.showToast({
  80. title: response.msg || "获取任务列表失败",
  81. icon: "none",
  82. });
  83. }
  84. } catch (error) {
  85. uni.showToast({
  86. title: "获取任务列表失败",
  87. icon: "none",
  88. });
  89. } finally {
  90. loading.value = false;
  91. }
  92. };
  93. // 搜索处理
  94. const onSearch = () => {
  95. fetchTaskList();
  96. };
  97. // 打开扫码
  98. const openScan = () => {
  99. // #ifdef APP-PLUS || MP-WEIXIN
  100. uni.scanCode({
  101. success: (res) => {
  102. searchText.value = res.result;
  103. onSearch();
  104. },
  105. fail: (err) => {
  106. uni.showToast({
  107. title: "扫码失败",
  108. icon: "error",
  109. });
  110. },
  111. });
  112. // #endif
  113. // #ifdef H5
  114. uni.showToast({
  115. title: "H5环境不支持扫码",
  116. icon: "none",
  117. });
  118. // #endif
  119. };
  120. // 点击任务卡片
  121. const handleTaskClick = (task) => {
  122. uni.showModal({
  123. title: "领取确认",
  124. content: "是否确认领取下架任务?",
  125. cancelText: "取消",
  126. confirmText: "确认",
  127. success: async (res) => {
  128. playGlobalSound()
  129. if (res.confirm) {
  130. try {
  131. const response = await uni.$u.http.post(`/app/appstock/lockStockTask?taskCode=${task.taskCode}`);
  132. if (response.code === 200) {
  133. uni.navigateTo({
  134. url: `/pages/index/wms/task-detail?taskCode=${task.taskCode}`,
  135. });
  136. } else {
  137. uni.showToast({
  138. title: response.msg || "任务锁定失败",
  139. icon: "none",
  140. });
  141. }
  142. } catch (error) {
  143. uni.showToast({
  144. title: error,
  145. icon: "none",
  146. });
  147. }
  148. }
  149. },
  150. });
  151. };
  152. // 页面加载时获取任务列表
  153. onMounted(() => {
  154. fetchTaskList();
  155. });
  156. </script>
  157. <style scoped>
  158. .task-card {
  159. background-color: #ffffff;
  160. padding: 20rpx;
  161. margin-top: 16rpx;
  162. box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.05);
  163. }
  164. .task-header {
  165. display: flex;
  166. justify-content: space-between;
  167. align-items: center;
  168. margin-bottom: 16rpx;
  169. }
  170. .task-no {
  171. font-size: 28rpx;
  172. font-weight: bold;
  173. }
  174. .empty-state {
  175. text-align: center;
  176. padding: 40rpx;
  177. color: #999;
  178. }
  179. .loading-state {
  180. text-align: center;
  181. padding: 40rpx;
  182. }
  183. .loading-state text {
  184. margin-left: 12rpx;
  185. color: #666;
  186. font-size: 28rpx;
  187. }
  188. </style>