classify.vue 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241
  1. <template>
  2. <view>
  3. <!-- 志愿者 -->
  4. <view class="classify-main" v-if="userType == '2'">
  5. <up-tabs :list="column" :scrollable="false" @change="onChange" :activeStyle="{
  6. color: 'rgba(221, 94, 69, 1)',
  7. fontWeight: 'bold',
  8. transform: 'scale(1.05)'
  9. }" lineColor="rgba(221, 94, 69, 1)" v-model:current="tabKey">
  10. </up-tabs>
  11. <view class="list">
  12. <List :data="data" v-if="data.length > 0" />
  13. <view v-else class="empty-null">
  14. <img src="/static/empty/订单为空.png" alt="">
  15. </view>
  16. </view>
  17. </view>
  18. <!-- 用户 -->
  19. <OrderList :dataList="dataList" :dictSort="dictData" @fetchData="getListData" v-else />
  20. </view>
  21. </template>
  22. <script setup>
  23. import {
  24. ref
  25. } from 'vue';
  26. import List from '@/pages/common/orderList/index.vue';
  27. import {
  28. provide
  29. } from 'vue';
  30. import {
  31. getVolunteerOrderList
  32. } from '@/api/volunteer.js'
  33. import {
  34. onMounted
  35. } from 'vue';
  36. import {
  37. useDict
  38. } from '@/utils/dict.js';
  39. import {
  40. onLoad,
  41. onShow
  42. } from '@dcloudio/uni-app';
  43. import OrderList from '@/pages/common/classify/orderlist.vue'
  44. import {
  45. userMainOrderList,
  46. systemDictdaTalist
  47. } from "@/api/userList.js"
  48. const {
  49. order_status,
  50. lrr_service_status
  51. } = useDict('order_status', 'lrr_service_status');
  52. provide('order_status', order_status); //订单/服务状态
  53. // provide('lrr_service_status', lrr_service_status); //订单/服务状态
  54. const userType = uni.getStorageSync('userType') //读取本地存储
  55. // 用户/志愿者 识别标识
  56. const userOrWorker = uni.getStorageSync('storage_data').vuex_userOrWorker //读取本地存储
  57. const tab = ref('');
  58. const tabKey = ref(0);
  59. const dataList = ref([]) //用户
  60. const data = ref([]); //志愿者
  61. // 定义存储字典数据的响应式变量
  62. const dictData = ref([]);
  63. /**
  64. * 0待支付 1已支付 2支付超时或取消 3进行中 4已完成 5申请退款中 6已退款 7部分退款 8 待确认
  65. */
  66. const column = [{
  67. name: "全部",
  68. value: "",
  69. },
  70. {
  71. name: "待服务",
  72. value: "0",
  73. },
  74. {
  75. name: "进行中",
  76. value: "1",
  77. },
  78. {
  79. name: "已完成",
  80. value: "2",
  81. },
  82. {
  83. name: "已取消",
  84. value: "3",
  85. }
  86. ]
  87. const column2 = [{
  88. name: "全部",
  89. value: "",
  90. },
  91. {
  92. name: "待支付",
  93. value: "1",
  94. },
  95. {
  96. name: "待服务",
  97. value: "2",
  98. },
  99. {
  100. name: "进行中",
  101. value: "3",
  102. },
  103. {
  104. name: "已完成",
  105. value: "4",
  106. },
  107. {
  108. name: "已取消",
  109. value: "5",
  110. }
  111. ]
  112. //获取用户订单列表状态
  113. async function getData() {
  114. console.log('进入');
  115. try {
  116. const res = await systemDictdaTalist().catch(err => {
  117. console.error('接口请求失败:', err);
  118. throw err; // 重新抛出以进入 catch 块
  119. });
  120. console.log(res, '用户状态获取成功');
  121. dictData.value = res.rows;
  122. console.log(dictData.value, 'dictData.value');
  123. } catch (e) {
  124. console.error('获取数据异常:', e); // 确保这里打印错误
  125. }
  126. }
  127. async function getList() {
  128. try {
  129. uni.hideLoading();
  130. uni.showLoading({
  131. title: '数据加载中...'
  132. });
  133. // 判断 userType 来决定调用哪个接口
  134. let res;
  135. if (userType === 1) {
  136. // 如果 userType 是 1,调用 userMainOrderList 接口
  137. res = await getListData();
  138. } else if (userType === 2) {
  139. // 如果 userType 是 2,调用 getVolunteerOrderList 接口
  140. res = await getVolunteerOrderList({
  141. orderStatus: tab.value
  142. });
  143. data.value = res.data;
  144. }
  145. } catch (error) {
  146. console.log('error', error);
  147. uni.showToast({
  148. title: error.msg,
  149. icon: 'error',
  150. });
  151. } finally {
  152. uni.hideLoading();
  153. }
  154. }
  155. const getListData = async (orderStatus = tab.value) => {
  156. const res = await userMainOrderList({
  157. orderStatus: orderStatus
  158. });
  159. dataList.value = res.data
  160. }
  161. /**
  162. * 1: 查看
  163. * 2:沟通
  164. * 3:上传照片
  165. */
  166. function btnClick(row, type) {
  167. if (type === 1 && row.orderStatus === '2') {
  168. uni.navigateTo({
  169. url: `/pages_classify/pages/order/index?orderId=${row.secondOrderId}`
  170. });
  171. return;
  172. }
  173. if (type === 1) {
  174. uni.navigateTo({
  175. url: `/pages_classify/pages/handle/index?orderId=${row.secondOrderId}`
  176. });
  177. return
  178. console.log('res==>',res);
  179. data.value = res.data;
  180. }
  181. //前往沟通
  182. uni.navigateTo({
  183. url: `/pages_orderuser/pages/talk/pages/index/index?orderId=${row.secondOrderId}`
  184. });
  185. }
  186. provide('onClick', btnClick);
  187. function onChange(tabItem) {
  188. tab.value = tabItem.value;
  189. getList();
  190. }
  191. onMounted(() => {
  192. getList()
  193. getListData()
  194. getData()
  195. })
  196. onShow(() => {
  197. const params = getApp().globalData.switchTabParams || {};
  198. tabKey.value = params.tabKey || 0;
  199. onChange(column[tabKey.value])
  200. // 使用后建议清除参数,避免重复读取
  201. getApp().globalData.switchTabParams = null;
  202. })
  203. </script>
  204. <style lang="scss" scoped>
  205. .classify-main {
  206. height: 100vh;
  207. .list {
  208. position: fixed;
  209. top: 50px;
  210. bottom: 0px;
  211. left: 0px;
  212. right: 0px;
  213. }
  214. }
  215. </style>