index.uvue 34 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048
  1. <template>
  2. <uni-navbar-lite :showLeft=false title="工单"></uni-navbar-lite>
  3. <view class="list-page">
  4. <!-- 搜索栏 -->
  5. <view class="search-bar">
  6. <view class="search-box">
  7. <image class="search-icon" src="/static/images/workbench/list/1.png" mode="aspectFit"></image>
  8. <input class="search-input" type="text" placeholder="搜索工单编码、风机编号" v-model="keyword" @confirm="handleSearch" @blur="handleSearch" />
  9. <text v-if="keyword.length > 0" class="clear-icon" @click="clearSearch">✕</text>
  10. </view>
  11. </view>
  12. <view class="status-bar">
  13. <scroll-view class="scroll-view_H" direction="horizontal" show-scrollbar="false">
  14. <view class="scroll-view-item_H uni-bg-red">
  15. <text class="status-txt" :class="{'stauts-sel': currentStatus === 'all'}" @click="switchStatus('all')">全部</text>
  16. </view>
  17. <!-- <view class="scroll-view-item_H uni-bg-green" v-if="checkPermi(['gxt:maintenance:order:edit','gxt:repairOrder:edit']) && !dealLoad">
  18. <text class="status-txt" :class="{'stauts-sel': currentStatus === 'to_issue,accept_return'}" @click="switchStatus('to_issue,accept_return')">待下发</text>
  19. </view> -->
  20. <view class="scroll-view-item_H uni-bg-green" v-if="checkPermi(['gxt:maintenance:order:accept','gxt:repairOrder:accept']) && !dealLoad">
  21. <text class="status-txt" :class="{'stauts-sel': currentStatus === 'assigned'}" @click="switchStatus('assigned')">待接单</text>
  22. </view>
  23. <view class="scroll-view-item_H" v-if="checkPermi(['gxt:maintenance:order:suspend','gxt:repairOrder:suspend']) && !dealLoad">
  24. <text class="status-txt" :class="{'stauts-sel': currentStatus === 'to_finish'}" @click="switchStatus('to_finish')">待结单</text>
  25. </view>
  26. <view class="scroll-view-item_H" v-if="checkPermi(['gxt:maintenance:order:approve','gxt:repairOrder:approve']) && !dealLoad">
  27. <text class="status-txt" :class="{'stauts-sel': currentStatus === 'to_approve'}" @click="switchStatus('to_approve')">待审批</text>
  28. </view>
  29. <view class="scroll-view-item_H" v-if="checkPermi(['gxt:maintenance:order:resume','gxt:repairOrder:resume']) && !dealLoad">
  30. <text class="status-txt" :class="{'stauts-sel': currentStatus === 'suspended'}" @click="switchStatus('suspended')">已挂起</text>
  31. </view>
  32. <view class="scroll-view-item_H" v-if="checkPermi(['gxt:maintenance:order:restart','gxt:repairOrder:restart']) && !dealLoad">
  33. <text class="status-txt" :class="{'stauts-sel': currentStatus === 'completed'}" @click="switchStatus('completed')">已完成</text>
  34. </view>
  35. <view class="scroll-view-item_H" v-if="dealLoad">
  36. <text class="status-txt" :class="{'stauts-sel': currentStatus === 'pending'}" @click="switchStatus('pending')">待处理</text>
  37. </view>
  38. </scroll-view>
  39. </view>
  40. <!-- 列表内容 -->
  41. <common-list
  42. :dataList="dataList"
  43. :loading="loading"
  44. :refreshing="refreshing"
  45. :hasMore="hasMore"
  46. @refresh="handleRefresh"
  47. @loadMore="loadMore"
  48. @itemClick="handleView"
  49. >
  50. <template #default="{ item, index }">
  51. <view class="list-item">
  52. <view class="item-container">
  53. <view class="item-header">
  54. <!-- <image class="location-icon" src="/static/images/workbench/list/2.png" mode="aspectFit"></image>
  55. <text class="item-title">{{ getOrderType(item) }}</text>
  56. <text class="detail-link">类型 ›</text> -->
  57. <text class="item-title">{{ getWorkOrderProjectNo(item) }}-{{ getPcsDeviceName(item) }}{{ getOrderType(item) }}</text>
  58. <text class="status-tag" :class="getStatusClass(item)">{{ getWorkOrderStatus(item) }}</text>
  59. </view>
  60. <view class="info-row">
  61. <view class="info-label">
  62. <text class="text-gray">{{ getDisplayTime(item) }}</text>
  63. </view>
  64. <view class="info-value">
  65. <!-- <button
  66. v-if="getOrderStatus(item) == 'assigned' && canHandleOrder(item,'')"
  67. class="btn-primary info-value"
  68. @click.stop="handleItemClick(item,'')"
  69. >
  70. 接单
  71. </button>
  72. <button
  73. v-else-if="getOrderStatus(item) == 'to_approve' && canHandleOrder(item,'')"
  74. class="btn-primary info-value"
  75. @click.stop="handleItemClick(item,'')"
  76. >
  77. 审批
  78. </button>
  79. <button
  80. v-else-if="getOrderStatus(item) == 'suspended' && canHandleOrder(item,'')"
  81. class="btn-primary info-value"
  82. @click.stop="handleItemClick(item,'')"
  83. >
  84. 恢复
  85. </button>
  86. <button
  87. v-else-if="getOrderStatus(item) == 'return' && canHandleOrder(item,'acceptReturn')"
  88. class="btn-primary info-value"
  89. @click.stop="handleItemClick(item,'acceptReturn')"
  90. >
  91. 退回
  92. </button>
  93. <button
  94. v-if="getOrderStatus(item) == 'assigned' && canHandleOrder(item,'acceptReturn')"
  95. class="btn-primary info-value"
  96. @click.stop="handleItemClick(item,'acceptReturn')"
  97. >
  98. 退回
  99. </button> -->
  100. </view>
  101. </view>
  102. <view class="btn-group">
  103. <view
  104. v-if="getOrderStatus(item) == 'assigned' && canHandleOrder(item,'accept')"
  105. class="btn-primary info-value"
  106. @click.stop="handleItemClick(item,'')"
  107. >
  108. <text class="btn-text">接单</text>
  109. </view>
  110. <view
  111. v-if="getOrderStatus(item) == 'to_approve' && canHandleOrder(item,'')"
  112. class="btn-primary info-value"
  113. @click.stop="handleItemClick(item,'')"
  114. >
  115. <text class="btn-text">审批</text>
  116. </view>
  117. <view
  118. v-if="getOrderStatus(item) == 'suspended' && canHandleOrder(item,'')"
  119. class="btn-primary info-value"
  120. @click.stop="handleItemClick(item,'')"
  121. >
  122. <text class="btn-text">恢复</text>
  123. </view>
  124. <view
  125. v-if="getOrderStatus(item) == 'return' && canHandleOrder(item,'acceptReturn')"
  126. class="btn-primary info-value"
  127. @click.stop="handleItemClick(item,'acceptReturn')"
  128. >
  129. <text class="btn-text">退回</text>
  130. </view>
  131. <view
  132. v-if="getOrderStatus(item) == 'assigned' && canHandleOrder(item,'acceptReturn')"
  133. class="btn-primary info-value"
  134. @click.stop="handleItemClick(item,'acceptReturn')"
  135. >
  136. <text class="btn-text">退回</text>
  137. </view>
  138. <view
  139. v-if="getOrderStatus(item) == 'to_finish' && canHandleOrder(item, 'return')"
  140. class="btn-primary info-value"
  141. @click.stop="handleItemClick(item, 'return')"
  142. >
  143. <text class="btn-text">退回</text>
  144. </view>
  145. <view
  146. v-if="getOrderStatus(item) == 'to_finish' && canHandleOrder(item, 'suspend')"
  147. class="btn-primary info-value"
  148. @click.stop="handleItemClick(item, 'suspend')"
  149. >
  150. <text class="btn-text">挂起</text>
  151. </view>
  152. <view
  153. v-if="getOrderStatus(item) == 'to_finish' && canHandleOrder(item, 'finalize')"
  154. class="btn-primary info-value"
  155. @click.stop="handleItemClick(item, 'finalize')"
  156. >
  157. <text class="btn-text">复启</text>
  158. </view>
  159. </view>
  160. </view>
  161. </view>
  162. </template>
  163. </common-list>
  164. <custom-tabbar :current="1" />
  165. </view>
  166. </template>
  167. <script setup lang="uts">
  168. import { ref, onBeforeUnmount, onMounted } from 'vue'
  169. import type { acceptOrderInfo } from '../../types/order'
  170. import type { SysDictData, DictDataResponse } from '../../types/dict'
  171. import { getOrderList } from '../../api/order/list'
  172. import { getDictDataByType } from '../../api/dict/index'
  173. import {checkPermi} from '../../utils/storage'
  174. // 列表数据
  175. const dataList = ref<acceptOrderInfo[]>([])
  176. let keyword = ref<string>("")
  177. const page = ref<number>(1)
  178. const pageSize: number = 10
  179. const hasMore = ref<boolean>(true)
  180. const loading = ref<boolean>(false)
  181. const refreshing = ref<boolean>(false)
  182. const total = ref<number>(0)
  183. let currentStatus = ref<string>('') // 添加状态管理
  184. const statusDictList = ref<SysDictData[]>([]) // 工单状态字典列表
  185. // 添加防重复请求的标志位(参考score/pending.uvue的实现)
  186. const isSearching = ref<boolean>(false)
  187. // 添加防重复刷新的标志
  188. const isRefreshing = ref<boolean>(false)
  189. // 添加刷新时间戳,用于防抖
  190. const lastRefreshTime = ref<number>(0)
  191. // 添加字典加载状态
  192. const dictLoaded = ref<boolean>(false)
  193. // 待处理工单加载
  194. const dealLoad = ref<boolean>(false)
  195. type StatusItem = {
  196. key: string,
  197. permis: string[],
  198. condition: () => boolean
  199. }
  200. const statusConfig: StatusItem[] = [
  201. { key: 'all', permis: ['gxt:order:all'], condition: () => !dealLoad.value },
  202. { key: 'assigned', permis: ['gxt:maintenance:order:accept','gxt:repairOrder:accept'], condition: () => !dealLoad.value },
  203. { key: 'to_finish', permis: ['gxt:maintenance:order:suspend','gxt:repairOrder:suspend'], condition: () => !dealLoad.value },
  204. { key: 'to_approve', permis: ['gxt:maintenance:order:approve','gxt:repairOrder:approve'], condition: () => !dealLoad.value },
  205. { key: 'suspended', permis: ['gxt:maintenance:order:resume','gxt:repairOrder:resume'], condition: () => !dealLoad.value },
  206. { key: 'completed', permis: ['gxt:maintenance:order:restart','gxt:repairOrder:restart'], condition: () => !dealLoad.value }
  207. ]
  208. const getOrderStatus = (item: any | null): string => {
  209. if (item == null) return ''
  210. const orderItem = item as acceptOrderInfo
  211. return orderItem.workOrderStatus ?? ''
  212. }
  213. // 获取工单状态字典列表
  214. const loadStatusDictList = async (): Promise<void> => {
  215. try {
  216. const result = await getDictDataByType('gxt_work_order_status')
  217. const resultObj = result as UTSJSONObject
  218. if (resultObj['code'] == 200) {
  219. const data = resultObj['data'] as any[]
  220. const dictData: SysDictData[] = []
  221. if (data.length > 0) {
  222. for (let i = 0; i < data.length; i++) {
  223. const item = data[i] as UTSJSONObject
  224. // 只提取需要的字段
  225. const dictItem: SysDictData = {
  226. dictValue: item['dictValue'] as string | null,
  227. dictLabel: item['dictLabel'] as string | null,
  228. dictCode: null,
  229. dictSort: null,
  230. dictType: null,
  231. cssClass: null,
  232. listClass: null,
  233. isDefault: null,
  234. status: null,
  235. default: null,
  236. createTime: null,
  237. remark: null
  238. }
  239. dictData.push(dictItem)
  240. }
  241. }
  242. statusDictList.value = dictData
  243. dictLoaded.value = true
  244. }
  245. } catch (e: any) {
  246. console.error('获取工单状态字典失败:', e.message)
  247. dictLoaded.value = true
  248. }
  249. }
  250. const getFirstVisibleStatus = (): string => {
  251. for (const item of statusConfig) {
  252. const hasPerm = item.permis.length === 0 || checkPermi(item.permis)
  253. const meetsCondition = item.condition()
  254. if (hasPerm && meetsCondition) {
  255. // if (hasPerm) {
  256. return item.key as string
  257. }
  258. }
  259. return 'all' // fallback,理论上不会走到这里
  260. }
  261. let loadCount = 0
  262. // 加载列表数据
  263. const loadData = async (isRefresh: boolean | null, disablePullDown: boolean | null): Promise<void> => {
  264. const id = ++loadCount
  265. console.log(`【loadData #${id}】开始, isRefresh=${isRefresh}, disablePullDown=${disablePullDown}`)
  266. // 防止重复请求的核心机制(参考score/pending.uvue的实现)
  267. if (loading.value) {
  268. // 确保刷新状态最终被重置,防止卡死
  269. if (isRefresh != true) {
  270. refreshing.value = false;
  271. }
  272. return
  273. }
  274. const shouldRefresh = isRefresh != null ? isRefresh : false
  275. const shouldDisablePullDown = disablePullDown != null ? disablePullDown : false
  276. loading.value = true
  277. if (shouldRefresh && !shouldDisablePullDown) {
  278. page.value = 1
  279. refreshing.value = true
  280. } else if (shouldRefresh && shouldDisablePullDown) {
  281. // 状态切换时,重置页码但不触发动画
  282. page.value = 1
  283. // 即使禁用下拉刷新,也要确保刷新状态最终被重置
  284. refreshing.value = false
  285. } else {
  286. // 对于加载更多操作,不需要显示下拉刷新状态
  287. refreshing.value = false;
  288. }
  289. try {
  290. // 处理默认值
  291. const searchKeyword = keyword.value.length > 0 ? keyword.value : null
  292. const result = await getOrderList(page.value, pageSize, searchKeyword, currentStatus.value)
  293. // 提取响应数据
  294. const resultObj = result as UTSJSONObject
  295. const code = resultObj['code'] as number
  296. const responseData = resultObj['rows'] as any[]
  297. const responseTotal = resultObj['total'] as number
  298. if (code == 200) {
  299. // 将 any[] 转换为 acceptOrderInfo[]
  300. const newData: acceptOrderInfo[] = []
  301. for (let i = 0; i < responseData.length; i++) {
  302. const item = responseData[i] as UTSJSONObject
  303. const orderItem: acceptOrderInfo = {
  304. orderType: item['orderType'] as Number,
  305. id: item['id'] as Number,
  306. teamLeaderId: item['teamLeaderId'] != null ? (item['teamLeaderId'] as Number) : 0,
  307. acceptUserId: item['acceptUserId'] != null ? (item['acceptUserId'] as Number) : 0,
  308. teamLeaderName: item['teamLeaderName'] as string | null,
  309. acceptUserName: item['acceptUserName'] as string | null,
  310. acceptTime: item['acceptTime'] as string | null,
  311. assignTime: item['assignTime'] as string | null,
  312. assignUserName: item['assignUserName'] as string | null,
  313. status: (item['status']==null)?0:item['status'] as Number,
  314. workOrderProjectNo: item['workOrderProjectNo'] as string | null,
  315. workOrderStatus: item['workOrderStatus'] as string | null,
  316. gxtCenterId: item['gxtCenterId'] as Number | 0,
  317. gxtCenter: item['gxtCenter'] as string | null,
  318. pcsStationId: item['pcsStationId'] as Number | 0,
  319. pcsStationName: item['pcsStationName'] as string | null,
  320. pcsDeviceId: item['pcsDeviceId'] as Number | 0,
  321. pcsDeviceName: item['pcsDeviceName'] as string | null,
  322. brand: item['brand'] as string | null,
  323. model: item['model'] as string | null,
  324. createTime: item['createTime'] as string | null,
  325. suspendReason: item['suspendReason'] as string | null,
  326. rejectionReason: item['rejectionReason'] as string | null,
  327. updateTime: item['updateTime'] as string | null, // 新增字段
  328. workEndTime: item['workEndTime'] as string | null // 新增字段
  329. }
  330. newData.push(orderItem)
  331. }
  332. // 不再在前端过滤,直接使用API返回的数据
  333. if (shouldRefresh) {
  334. dataList.value = newData
  335. } else {
  336. dataList.value = [...dataList.value, ...newData]
  337. }
  338. total.value = responseTotal
  339. hasMore.value = dataList.value.length < responseTotal
  340. // 通知首页更新待接单数量
  341. if (currentStatus.value === 'assigned') {
  342. uni.$emit('refreshAssignedCount')
  343. }
  344. } else {
  345. const msg = resultObj['msg'] as string | null
  346. uni.showToast({
  347. title: msg ?? '加载失败',
  348. icon: 'none'
  349. })
  350. }
  351. } catch (e: any) {
  352. uni.showToast({
  353. title: e.message ?? '加载失败',
  354. icon: 'none'
  355. })
  356. } finally {
  357. loading.value = false
  358. // 确保刷新状态能结束(参考score/pending.uvue的实现)
  359. if (shouldRefresh) {
  360. refreshing.value = false;
  361. // 使用setTimeout确保状态彻底重置
  362. setTimeout(() => {
  363. isRefreshing.value = false;
  364. }, 50);
  365. }
  366. }
  367. }
  368. // 辅助函数:从 any 类型提取属性
  369. const getOrderType = (item: any | null): string => {
  370. if (item == null) return ''
  371. const orderInfoItem = item as acceptOrderInfo
  372. return orderInfoItem.orderType == 1?"维修工单":"维保工单";
  373. }
  374. const getWorkOrderProjectNo = (item: any | null): string | null => {
  375. if (item == null) return ''
  376. const orderInfoItem = item as acceptOrderInfo
  377. return orderInfoItem.workOrderProjectNo
  378. }
  379. const getPcsStationName = (item: any | null): string | null=> {
  380. if (item == null) return ''
  381. const orderInfoItem = item as acceptOrderInfo
  382. return orderInfoItem.pcsStationName
  383. }
  384. const getPcsDeviceName = (item: any | null): string | null=> {
  385. if (item == null) return ''
  386. const orderInfoItem = item as acceptOrderInfo
  387. return orderInfoItem.pcsDeviceName
  388. }
  389. const getAssignTime = (item: any | null): string|null => {
  390. if (item == null) return null
  391. const orderInfoItem = item as acceptOrderInfo
  392. return orderInfoItem.assignTime
  393. }
  394. const getAcceptTime = (item: any | null): string|null => {
  395. if (item == null) return null
  396. const orderInfoItem = item as acceptOrderInfo
  397. return orderInfoItem.acceptTime
  398. }
  399. const getCreateTime = (item: any | null): string|null => {
  400. if (item == null) return null
  401. const orderInfoItem = item as acceptOrderInfo
  402. return orderInfoItem.createTime
  403. }
  404. // 根据状态显示不同的时间
  405. const getDisplayTime = (item: any | null): string|null => {
  406. if (item == null) return null
  407. const orderInfoItem = item as acceptOrderInfo
  408. // 如果是"待接单"状态,显示派单时间
  409. if (orderInfoItem.workOrderStatus == 'assigned') {
  410. return '下发时间:' + orderInfoItem.assignTime
  411. } else if(orderInfoItem.workOrderStatus == 'to_finish') {
  412. if(orderInfoItem.workEndTime != null) {
  413. return '结束时间:' + orderInfoItem.workEndTime
  414. }
  415. return '接单时间:' + orderInfoItem.acceptTime
  416. } else if(orderInfoItem.workOrderStatus == 'to_approve') {
  417. return '申请挂起时间:' + orderInfoItem.updateTime
  418. } else if(orderInfoItem.workOrderStatus == 'suspended') {
  419. return '审批通过时间:' + orderInfoItem.updateTime
  420. } else if(orderInfoItem.workOrderStatus == 'return' || orderInfoItem.workOrderStatus == 'accept_return') {
  421. return '退回时间:' + orderInfoItem.updateTime
  422. } else if(orderInfoItem.workOrderStatus == 'completed') {
  423. return '结单时间:' + orderInfoItem.updateTime
  424. } else if(orderInfoItem.workOrderStatus == 'archived') {
  425. return '归档时间:' + orderInfoItem.updateTime
  426. }
  427. // 默认显示创建时间
  428. return '创建时间:' + orderInfoItem.createTime
  429. }
  430. const getWorkOrderStatus = (item: any | null): string | null => {
  431. if (item == null) return ''
  432. const orderInfoItem = item as acceptOrderInfo
  433. const rawStatus = orderInfoItem.workOrderStatus
  434. if (rawStatus==null) return ''
  435. // 如果字典尚未加载,返回原始值
  436. if (!dictLoaded.value) {
  437. return rawStatus
  438. }
  439. // 查找字典中对应的标签
  440. const dictItem = statusDictList.value.find(dict => dict.dictValue == rawStatus)
  441. return dictItem!=null ? dictItem.dictLabel : rawStatus
  442. }
  443. const getStatusClass = (item: any | null): string => {
  444. if (item == null) return ''
  445. const orderInfoItem = item as acceptOrderInfo
  446. const rawStatus = orderInfoItem.workOrderStatus
  447. if (rawStatus==null) return ''
  448. // const status = rawStatus
  449. // 返回对应的状态类名
  450. return `status-${rawStatus}`
  451. }
  452. // 切换状态
  453. const switchStatus = (status: string): void => {
  454. // 添加防重复调用检查(参考score/pending.uvue的实现)
  455. if (loading.value) {
  456. return;
  457. }
  458. // 添加防重复请求检查
  459. if (isSearching.value) {
  460. return
  461. }
  462. isSearching.value = true
  463. currentStatus.value = status
  464. page.value = 1
  465. loadData(true, true) // 第二个参数为true表示禁用下拉刷新动画
  466. // 延迟重置标志位,确保请求发送后才允许下一次搜索
  467. setTimeout(() => {
  468. isSearching.value = false
  469. }, 100)
  470. }
  471. // 下拉刷新
  472. const handleRefresh = async (): Promise<void> => {
  473. console.log("handleRefresh被触发")
  474. console.log("loading.value===",loading.value)
  475. console.log("isRefreshing.value===",isRefreshing.value)
  476. // 防抖处理,避免频繁触发(参考score/pending.uvue的实现)
  477. const now = Date.now();
  478. if (now - lastRefreshTime.value < 1000) {
  479. refreshing.value = false;
  480. return;
  481. }
  482. lastRefreshTime.value = now;
  483. // 添加防重复调用检查
  484. if (loading.value || isRefreshing.value) {
  485. // 如果已经在加载或正在刷新,直接重置刷新状态
  486. refreshing.value = false;
  487. return;
  488. }
  489. console.log("loading.value1===",loading.value)
  490. console.log("isRefreshing.value1===",isRefreshing.value)
  491. // 设置刷新标志
  492. isRefreshing.value = true;
  493. try {
  494. await loadData(true, false); // 使用默认的下拉刷新行为
  495. } catch (error) {
  496. console.error('刷新失败:', error);
  497. refreshing.value = false;
  498. isRefreshing.value = false;
  499. }
  500. // 确保在一定时间后重置刷新标志,防止意外情况
  501. setTimeout(() => {
  502. isRefreshing.value = false
  503. }, 100) // 延迟重置,确保状态完全更新
  504. }
  505. // 加载更多
  506. const loadMore = (): void => {
  507. if (!hasMore.value || loading.value) {
  508. return
  509. }
  510. page.value++
  511. loadData(false, false)
  512. }
  513. // 搜索
  514. const handleSearch = (): void => {
  515. // 添加防重复调用检查(参考score/pending.uvue的实现)
  516. if (loading.value) {
  517. return;
  518. }
  519. // 添加防重复请求检查
  520. if (isSearching.value) {
  521. return
  522. }
  523. isSearching.value = true
  524. page.value = 1
  525. loadData(true, true) // 状态切换时禁用下拉刷新动画
  526. // 延迟重置标志位,确保请求发送后才允许下一次搜索
  527. setTimeout(() => {
  528. isSearching.value = false
  529. }, 100)
  530. }
  531. const handleSearchOnBlur = (): void => {
  532. handleSearch()
  533. }
  534. // 方法:判断当前工单是否显示操作按钮(基于 orderType)
  535. const canHandleOrder = (item: any | null, buttonType: string | ''): boolean => {
  536. if (item == null) return false
  537. let permit: string[] = []
  538. const orderItem = item as acceptOrderInfo
  539. if(orderItem.workOrderStatus == 'assigned' && buttonType != '' && buttonType == "acceptReturn" && orderItem.orderType == 1) {
  540. // 接单退回
  541. permit = ['gxt:repairOrder:acceptReturn']
  542. } else if(orderItem.workOrderStatus == 'assigned' && buttonType != '' && buttonType == "accept") {
  543. // 接单
  544. permit = orderItem.orderType == 2 ? ['gxt:maintenance:order:accept'] : ['gxt:repairOrder:accept']
  545. } else if(orderItem.workOrderStatus == 'to_finish') {
  546. if(buttonType != '' && buttonType == "suspend") {
  547. // 挂起
  548. permit = orderItem.orderType == 2 ? ['gxt:maintenance:order:suspend'] : ['gxt:repairOrder:suspend']
  549. } else if(buttonType != '' && buttonType == "return" && orderItem.orderType == 1) {
  550. // 退回
  551. permit = orderItem.orderType == 2 ? ['gxt:maintenance:order:return'] : ['gxt:repairOrder:return']
  552. } else if(buttonType != '' && buttonType == "finalize" && orderItem.orderType == 1) {
  553. // 复启
  554. permit = orderItem.orderType == 2 ? ['gxt:maintenance:order:finalize'] : ['gxt:repairOrder:finalize']
  555. }
  556. } else if(orderItem.workOrderStatus == 'to_approve') {
  557. // 审批
  558. permit = orderItem.orderType == 2 ? ['gxt:maintenance:order:approve'] : ['gxt:repairOrder:approve']
  559. } else if(orderItem.workOrderStatus == 'suspended') {
  560. // 恢复
  561. permit = orderItem.orderType == 2 ? ['gxt:maintenance:order:resume'] : ['gxt:repairOrder:resume']
  562. } else if(orderItem.workOrderStatus == 'return') {
  563. // 接单退回
  564. permit = ['gxt:repairOrder:acceptReturn']
  565. }
  566. else {
  567. return false
  568. }
  569. // const orderType = (item as acceptOrderInfo).orderType
  570. return checkPermi(permit)
  571. }
  572. // 点击列表项
  573. const handleItemClick = (item: any | null, buttonType: string | ''): void => {
  574. if (item == null) return
  575. const orderItem = item as acceptOrderInfo
  576. // if(currentStatus.value === '' || currentStatus.value === 'completed' || currentStatus.value === 'all') {
  577. // // 传递orderType参数以便详情页决定调用哪个API
  578. // uni.navigateTo({
  579. // url: `/pages/order/detail/index?id=${orderItem.id}&orderType=${orderItem.orderType}`
  580. // })
  581. // } else
  582. if(orderItem.workOrderStatus == 'assigned') {
  583. if(buttonType != '' && buttonType == "acceptReturn") {
  584. // 跳转到退回页面
  585. uni.navigateTo({
  586. url: `/pages/order/detail/returnIndex?id=${orderItem.id}&orderType=${orderItem.orderType}`
  587. })
  588. } else {
  589. // 跳转到接单页面
  590. uni.navigateTo({
  591. url: `/pages/order/detail/acceptIndex?id=${orderItem.id}&orderType=${orderItem.orderType}`
  592. })
  593. }
  594. } else if(orderItem.workOrderStatus == 'to_finish') {
  595. if(buttonType != '' && buttonType == "suspend") {
  596. // 跳转到待结单页面
  597. uni.navigateTo({
  598. url: `/pages/order/detail/suspendIndex?id=${orderItem.id}&orderType=${orderItem.orderType}`
  599. })
  600. } else if(buttonType != '' && buttonType == "return") {
  601. // 跳转到退回页面
  602. uni.navigateTo({
  603. url: `/pages/order/detail/returnIndex?id=${orderItem.id}&orderType=${orderItem.orderType}`
  604. })
  605. } else if(buttonType != '' && buttonType == "finalize") {
  606. // 跳转到复启页面
  607. uni.navigateTo({
  608. url: `/pages/order/detail/resetIndex?id=${orderItem.id}&orderType=${orderItem.orderType}`
  609. })
  610. }
  611. } else if(orderItem.workOrderStatus == 'to_approve') {
  612. // 跳转到待审批页面
  613. uni.navigateTo({
  614. url: `/pages/order/detail/approveIndex?id=${orderItem.id}&orderType=${orderItem.orderType}`
  615. })
  616. } else if(orderItem.workOrderStatus == 'suspended') {
  617. // 跳转到恢复页面
  618. uni.navigateTo({
  619. url: `/pages/order/detail/resumeIndex?id=${orderItem.id}&orderType=${orderItem.orderType}`
  620. })
  621. } else if(orderItem.workOrderStatus == 'return') {
  622. // 跳转到退回页面
  623. uni.navigateTo({
  624. url: `/pages/order/detail/returnIndex?id=${orderItem.id}&orderType=${orderItem.orderType}`
  625. })
  626. } else {
  627. uni.navigateTo({
  628. url: `/pages/order/detail/index?id=${orderItem.id}&orderType=${orderItem.orderType}`
  629. })
  630. }
  631. }
  632. // 点击列表项
  633. const handleView = (item: any | null): void => {
  634. if (item == null) return
  635. const orderItem = item as acceptOrderInfo
  636. uni.navigateTo({
  637. url: `/pages/order/detail/index?id=${orderItem.id}&orderType=${orderItem.orderType}`
  638. })
  639. }
  640. // 查看工单详情
  641. const showWorkOrderDetail = (item: any | null): void => {
  642. if (item == null) return
  643. const orderItem = item as acceptOrderInfo
  644. uni.navigateTo({
  645. url: `/pages/workbench/detail/index?id=${orderItem.id}`
  646. })
  647. }
  648. // 清空搜索
  649. const clearSearch = (): void => {
  650. // 添加防重复调用检查(参考score/pending.uvue的实现)
  651. if (loading.value) {
  652. return;
  653. }
  654. // 添加防重复请求检查
  655. if (isSearching.value) {
  656. return
  657. }
  658. isSearching.value = true
  659. keyword.value = ""
  660. page.value = 1
  661. loadData(true, true) // 状态切换时禁用下拉刷新动画
  662. // 延迟重置标志位,确保请求发送后才允许下一次搜索
  663. setTimeout(() => {
  664. isSearching.value = false
  665. }, 100)
  666. }
  667. // 初始化
  668. // onMounted(() => {
  669. onLoad((options: any) => {
  670. const params = options as UTSJSONObject
  671. const isDeal = params['isDeal'] as string | null
  672. if(isDeal != null) {
  673. dealLoad.value = true;
  674. }
  675. loadStatusDictList()
  676. // 自动选中第一个可显示的状态
  677. // currentStatus.value = getFirstVisibleStatus()
  678. currentStatus.value = 'all'
  679. loadData(true, true) // 首次加载时禁用下拉刷新动画
  680. // 监听首页切换状态事件
  681. uni.$on('switchOrderStatus', (status: string) => {
  682. switchStatus(status)
  683. })
  684. // 监听接单成功的事件,刷新列表
  685. uni.$on('refreshOrderList', () => {
  686. page.value = 1
  687. loadData(true, false)
  688. })
  689. })
  690. // 组件卸载前清理事件监听
  691. onBeforeUnmount(() => {
  692. refreshing.value = false
  693. loading.value = false
  694. isRefreshing.value = false
  695. // 移除事件监听
  696. uni.$off('refreshOrderList',{})
  697. uni.$off('switchOrderStatus',{})
  698. })</script>
  699. <style lang="scss">
  700. .list-page {
  701. flex: 1;
  702. background-color: #e8f0f9;
  703. }
  704. .search-bar {
  705. padding: 20rpx 30rpx;
  706. background-color: #d7eafe;
  707. }
  708. .search-box {
  709. flex-direction: row;
  710. align-items: center;
  711. height: 72rpx;
  712. padding: 0 24rpx;
  713. background-color: #f5f5f5;
  714. border-radius: 36rpx;
  715. .search-icon {
  716. width: 32rpx;
  717. height: 32rpx;
  718. margin-right: 12rpx;
  719. }
  720. .search-input {
  721. flex: 1;
  722. font-size: 28rpx;
  723. color: #333333;
  724. }
  725. .clear-icon {
  726. margin-left: 12rpx;
  727. font-size: 28rpx;
  728. color: #999999;
  729. }
  730. }
  731. .status-bar{
  732. padding-bottom: 10px;
  733. padding-left:30rpx;
  734. background-color: #d7eafe;
  735. }
  736. .status-box {
  737. flex-direction: row;
  738. align-items: center;
  739. height: 72rpx;
  740. flex: 1;
  741. .status-txt{
  742. padding: 8px 12px;
  743. text-align: center;
  744. margin-right: 12rpx;
  745. border-radius: 36rpx;
  746. background-color: #fff;
  747. font-size: 28rpx;
  748. // cursor: pointer;
  749. }
  750. .stauts-sel{
  751. background-color: #007AFF;
  752. color: #fff;
  753. }
  754. }
  755. .list-item {
  756. margin: 24rpx 30rpx;
  757. background-color: #ffffff;
  758. border-radius: 16rpx;
  759. }
  760. .item-container {
  761. padding: 30rpx;
  762. }
  763. .item-header {
  764. flex-direction: row;
  765. align-items: center;
  766. margin-bottom: 16rpx;
  767. .location-icon {
  768. width: 32rpx;
  769. height: 32rpx;
  770. margin-right: 8rpx;
  771. }
  772. .item-title {
  773. flex: 1;
  774. font-size: 32rpx;
  775. color: #333333;
  776. font-weight: bold;
  777. }
  778. .detail-link {
  779. font-size: 28rpx;
  780. color: #999999;
  781. }
  782. }
  783. .item-address {
  784. font-size: 26rpx;
  785. color: #999999;
  786. margin-bottom: 20rpx;
  787. line-height: 40rpx;
  788. }
  789. .btn-primary {
  790. z-index: 999;
  791. border-radius: 10rpx;
  792. font-size: 24rpx;
  793. // white-space: nowrap;
  794. margin-left: 20rpx;
  795. background-color: #165DFF;
  796. line-height: 45rpx;
  797. color: #ffffff;
  798. .btn-text{
  799. color: #ffffff;
  800. font-size: 24rpx;
  801. padding: 5px 15px;
  802. }
  803. }
  804. .item-header {
  805. flex-direction: row;
  806. align-items: flex-start;
  807. margin-bottom: 16rpx;
  808. .item-title {
  809. font-size: 30rpx;
  810. color: #333333;
  811. font-weight: bold;
  812. flex-wrap: wrap;
  813. flex: 0 1 80%;
  814. min-width: 0;
  815. }
  816. .info-value {
  817. font-size: 28rpx;
  818. color: #999999;
  819. margin-left: auto;
  820. flex: 0 0 auto;
  821. white-space: nowrap;
  822. }
  823. }
  824. .info-row {
  825. flex-direction: row;
  826. justify-content: space-between;
  827. align-items: center;
  828. .info-label {
  829. font-size: 26rpx;
  830. color: #666;
  831. }
  832. .info-value {
  833. font-size: 26rpx;
  834. // color: #666;
  835. }
  836. }
  837. .text-gray{
  838. font-size: 26rpx;
  839. color: #666;
  840. }
  841. .status-tag {
  842. padding: 8rpx 20rpx;
  843. border-radius: 20rpx;
  844. font-size: 24rpx;
  845. white-space: nowrap;
  846. margin-left: 50rpx;
  847. border: 1rpx solid;
  848. }
  849. /* 待接单 */
  850. .status-assigned {
  851. background-color: #ebf5ff;
  852. color: #409eff;
  853. border-color: #d8ebff;
  854. }
  855. /* 待结单 */
  856. .status-to_finish {
  857. background-color: #fff7e6;
  858. color: #fa8c16;
  859. border-color: #ffd591;
  860. }
  861. /* 待审批 */
  862. .status-to_approve {
  863. background-color: #fff7e6;
  864. color: #fa8c16;
  865. border-color: #ffd591;
  866. }
  867. /* 已挂起 */
  868. .status-suspended {
  869. background-color: #fff2f0;
  870. color: #ff4d4f;
  871. border-color: #ffccc7;
  872. }
  873. /* 已完成 */
  874. .status-completed {
  875. background-color: #f0f9eb;
  876. color: #5cb87a;
  877. border-color: #c2e7b0;
  878. }
  879. /* 待下发 */
  880. .status-to_issue {
  881. background-color: #f4f4f5;
  882. color: #909399;
  883. border-color: #e9e9eb;
  884. }
  885. /* 已归档 */
  886. .status-archived {
  887. background-color: #f0f9eb;
  888. color: #5cb87a;
  889. border-color: #c2e7b0;
  890. }
  891. /* 退回 */
  892. .status-return {
  893. background-color: #fff2f0;
  894. color: #ff4d4f;
  895. border-color: #ffccc7;
  896. }
  897. /* 退回 */
  898. .status-accept_return {
  899. background-color: #fff2f0;
  900. color: #ff4d4f;
  901. border-color: #ffccc7;
  902. }
  903. /* 作废 */
  904. .status-invalid {
  905. background-color: #fff2f0;
  906. color: #ff4d4f;
  907. border-color: #ffccc7;
  908. }
  909. .scroll-view_H {
  910. width: 100%;
  911. flex-direction: row;
  912. }
  913. .scroll-view-item_H {
  914. justify-content: center;
  915. align-items: center;
  916. .status-txt{
  917. padding: 8px 12px;
  918. text-align: center;
  919. margin-right: 12rpx;
  920. border-radius: 36rpx;
  921. background-color: #fff;
  922. font-size: 28rpx;
  923. }
  924. .stauts-sel{
  925. background-color: #007AFF;
  926. color: #fff;
  927. }
  928. }
  929. .btn-group {
  930. flex-direction: row;
  931. align-items: center;
  932. justify-content: flex-end;
  933. margin-top: 20rpx;
  934. }
  935. </style>