index.uvue 47 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718
  1. <template>
  2. <uni-navbar-lite :showLeft="false" title="工分" />
  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
  9. class="search-input"
  10. placeholder="搜索工单编码、风机编号"
  11. v-model="searchKeyword"
  12. @confirm="handleSearch"
  13. @blur="handleSearch"
  14. />
  15. <text v-if="searchKeyword.length > 0" class="clear-icon" @click="clearSearch">✕</text>
  16. </view>
  17. </view>
  18. <!-- 工单评分状态筛选 -->
  19. <view class="status-bar">
  20. <scroll-view class="scroll-view_H" direction="horizontal" show-scrollbar="false">
  21. <view class="scroll-view-item_H">
  22. <text
  23. class="status-txt"
  24. :class="{ 'stauts-sel': statusFilter === '' }"
  25. @click="filterByStatus('')"
  26. >
  27. 全部
  28. </text>
  29. </view>
  30. <view class="scroll-view-item_H">
  31. <text
  32. class="status-txt"
  33. :class="{ 'stauts-sel': statusFilter === 'to_self' }"
  34. @click="filterByStatus('to_self')"
  35. >
  36. 待自评
  37. </text>
  38. </view>
  39. <view class="scroll-view-item_H">
  40. <text
  41. class="status-txt"
  42. :class="{ 'stauts-sel': statusFilter === 'to_re' }"
  43. @click="filterByStatus('to_re')"
  44. >
  45. 待复评
  46. </text>
  47. </view>
  48. <view class="scroll-view-item_H">
  49. <text
  50. class="status-txt"
  51. :class="{ 'stauts-sel': statusFilter === 'returned' }"
  52. @click="filterByStatus('returned')"
  53. >
  54. 已退回
  55. </text>
  56. </view>
  57. <!--
  58. <view class="scroll-view-item_H">
  59. <text
  60. class="status-txt"
  61. :class="{ 'stauts-sel': statusFilter === 'to_final' }"
  62. @click="filterByStatus('to_final')"
  63. >
  64. 待终评
  65. </text>
  66. </view>
  67. <view class="scroll-view-item_H">
  68. <text
  69. class="status-txt"
  70. :class="{ 'stauts-sel': statusFilter === 'appealing' }"
  71. @click="filterByStatus('appealing')"
  72. >
  73. 申诉中
  74. </text>
  75. </view>
  76. <text
  77. class="status-txt"
  78. :class="{ 'stauts-sel': statusFilter === 'to_confirm' }"
  79. @click="filterByStatus('to_confirm')"
  80. >
  81. 待确认
  82. </text>-->
  83. </scroll-view>
  84. </view>
  85. <view class="stats-section">
  86. <!-- 标签切换 -->
  87. <view class="stats-tabs">
  88. <text
  89. class="tab-item"
  90. :class="{ 'tab-active': activeTab === 'ranking' }"
  91. @click="switchTab('ranking')"
  92. >
  93. 个人排名
  94. </text>
  95. <text
  96. class="tab-item"
  97. :class="{ 'tab-active': activeTab === 'score' }"
  98. @click="switchTab('score')"
  99. >
  100. 月度工分
  101. </text>
  102. </view>
  103. <!-- 个人排名内容 -->
  104. <view v-if="activeTab === 'ranking'" class="ranking-content">
  105. <!-- 排名模块 -->
  106. <view v-if="rankingItems.length > 0">
  107. <view class="ranking-item-wrapper" v-for="(item, index) in rankingItems" :key="index">
  108. <view class="ranking-item" @click="goToRankingDetail(getRankingType(index))">
  109. <view class="ranking-circle-wrapper">
  110. <view class="ranking-number" :class="getRankingSizeClass(index)">
  111. <text class="ranking-number-text">{{ item.rank }}/{{ item.total }}</text>
  112. </view>
  113. </view>
  114. <text class="ranking-name">{{ item.name }}</text>
  115. <text class="ranking-label">第{{ item.rank }}名</text>
  116. </view>
  117. </view>
  118. </view>
  119. <view v-else class="no-data">
  120. <text class="no-data-text">无排名数据</text>
  121. </view>
  122. </view>
  123. <!-- 月度工分内容 -->
  124. <view v-if="activeTab === 'score'" class="score-content">
  125. <view class="stats-header">
  126. <text class="stats-title">{{ monthTitle }}月度工分</text>
  127. <view class="month-filters">
  128. <view class="month-tab">
  129. <text
  130. class="month-filter"
  131. :class="{ 'month-filter-sel': selectedMonth === 'prev' }"
  132. @click="changeMonth('prev')"
  133. >
  134. 上月
  135. </text>
  136. </view>
  137. <view class="month-tab">
  138. <text
  139. class="month-filter"
  140. :class="{ 'month-filter-sel': selectedMonth === 'current' }"
  141. @click="changeMonth('current')"
  142. >
  143. 本月
  144. </text>
  145. </view>
  146. <view class="month-tab">
  147. <text
  148. class="month-filter"
  149. :class="{ 'month-filter-sel': selectedMonth === 'custom' }"
  150. @click="showCustomDatePicker"
  151. >
  152. 自定义
  153. </text>
  154. </view>
  155. </view>
  156. </view>
  157. <!-- 统计数据 -->
  158. <view class="stats-content">
  159. <view class="total-score">
  160. <text class="score-value">{{ totalScore }}分</text>
  161. <text class="score-label">{{ monthTitle }}总工分</text>
  162. </view>
  163. <view class="score-breakdown">
  164. <view class="breakdown-item">
  165. <text class="breakdown-label">维保工分</text>
  166. <text class="breakdown-value">{{ maintenanceScore }}分</text>
  167. </view>
  168. <view class="breakdown-item">
  169. <text class="breakdown-label">维修工分</text>
  170. <text class="breakdown-value">{{ repairScore }}分</text>
  171. </view>
  172. <!-- <view v-if="rank !== null && totalRankingUsers !== null" class="breakdown-item">
  173. <text class="breakdown-label">排名</text>
  174. <text class="breakdown-value">{{ rank }}/{{ totalRankingUsers }}</text>
  175. </view> -->
  176. </view>
  177. </view>
  178. </view>
  179. </view>
  180. <!-- 工单评分列表 -->
  181. <common-list
  182. :dataList="orderList"
  183. :loading="loading"
  184. :refreshing="refreshing"
  185. :hasMore="hasMore"
  186. @refresh="handleRefresh"
  187. @loadMore="loadMore"
  188. @itemClick="handleItemClick"
  189. class="list-with-padding"
  190. >
  191. <template #default="{ item, index }">
  192. <view class="list-item">
  193. <view class="item-container">
  194. <view class="item-header">
  195. <text class="item-title">{{ getPropertyValue(item, 'workOrderProjectNo') }}-{{ getPropertyValue(item, 'pcsStationName') }}{{ getPropertyValue(item, 'pcsDeviceName') }}{{ getWorkOrderTypeText(getPropertyValue(item, 'orderType')) }}</text>
  196. <!-- <text class="info-value">{{ getScoringStatus(item) }}</text> -->
  197. <text class="status-tag" :class="getStatusClass(item)">{{ getScoringStatus(item) }}</text>
  198. </view>
  199. <view class="info-row">
  200. <view class="info-label">
  201. <text class="text-gray">{{ getWorkOrderTypeInfo(item) }}</text>
  202. </view>
  203. <view class="info-value-row">
  204. <text v-if="getPropertyValue(item, 'myScore') !== ''" class="score-text">{{ formatNumber(parseFloat(getPropertyValue(item, 'myScore'))) }}</text>
  205. <!-- <text class="status-text">{{ getOrderStatusText(getPropertyValue(item, 'scoreStatus')) }}</text> -->
  206. </view>
  207. </view>
  208. <view class="info-row">
  209. <view class="info-label">
  210. <text class="text-gray">工作结束时间: {{ getPropertyValue(item, 'realEndTime') }}</text>
  211. </view>
  212. </view>
  213. <view class="btn-group">
  214. <view
  215. v-if="getPropertyValue(item, 'scoringStatus') == 'to_self' || getPropertyValue(item, 'scoringStatus') == 'returned'"
  216. class="btn-primary info-value"
  217. @click.stop="handleScoreClick(item, 'self')"
  218. >
  219. <text class="btn-text">自评</text>
  220. </view>
  221. <view
  222. v-if="getPropertyValue(item, 'scoringStatus') == 'to_re'"
  223. class="btn-primary info-value"
  224. @click.stop="handleScoreClick(item, 're')"
  225. >
  226. <text class="btn-text">复评</text>
  227. </view>
  228. </view>
  229. </view>
  230. </view>
  231. </template>
  232. </common-list>
  233. <!-- 自定义时间选择弹窗 -->
  234. <l-popup v-model="showDatePickerPopup" position="bottom">
  235. <view class="date-picker-popup">
  236. <view class="popup-header">
  237. <text class="popup-title">选择年月</text>
  238. <view class="popup-actions">
  239. <!-- <view class="popup-btn">
  240. <text class="cancel-btn" @click="closeDatePicker">取消</text>
  241. </view> -->
  242. </view>
  243. </view>
  244. <view class="date-picker-container">
  245. <view class="date-picker-item">
  246. <!-- <text class="date-label">选择年月</text> -->
  247. <view class="date-display" @click="openDatePicker">
  248. {{ customDate != null && customDate != '' ? customDate : '请选择年月' }}
  249. </view>
  250. </view>
  251. </view>
  252. </view>
  253. </l-popup>
  254. <!-- Date Picker -->
  255. <l-popup v-model="showDatePicker" position="bottom" :z-index="1000">
  256. <l-date-time-picker
  257. :mode="3"
  258. format="YYYY-MM"
  259. :modelValue="customDate"
  260. confirm-btn="确定"
  261. cancel-btn="取消"
  262. @confirm="onDateConfirm"
  263. @cancel="showDatePicker = false">
  264. </l-date-time-picker>
  265. </l-popup>
  266. <!-- 底部 TabBar -->
  267. <custom-tabbar :current="3" :hide0="tabbar[0]" :hide1="tabbar[1]" :hide2="tabbar[2]" :hide3="tabbar[3]"/>
  268. </view>
  269. </template>
  270. <script setup lang="uts">
  271. import { ref, computed, onMounted, onBeforeUnmount, onShow, reactive } from 'vue'
  272. import { listOrderScores, getOrderScoreStatistics, listMobileOrderScores } from '@/api/score/index'
  273. import { getDictDataByType } from '@/api/dict/index'
  274. import { selectHomePageData } from '@/api/index/index'
  275. import type { SysDictData } from '@/types/dict'
  276. import {checkPermi} from '../../utils/storage'
  277. // 数据状态
  278. const searchKeyword = ref<string>('')
  279. const statusFilter = ref<string>('')
  280. const selectedMonth = ref<string>('current')
  281. const loading = ref<boolean>(false)
  282. const refreshing = ref<boolean>(false)
  283. const hasMore = ref<boolean>(true)
  284. const orderList = ref<any[]>([])
  285. const currentPage = ref<number>(1)
  286. const totalScore = ref<number>(0)
  287. const maintenanceScore = ref<number>(0)
  288. const repairScore = ref<number>(0)
  289. const rank = ref<number | null>(null)
  290. const totalRankingUsers = ref<number | null>(null)
  291. const customDate = ref<string>('')
  292. // 新增:标签切换相关
  293. const activeTab = ref<string>('ranking') // 默认显示个人排名
  294. // 用户数据类型定义
  295. type RankingItem = {
  296. name: string;
  297. rank: number;
  298. total: number;
  299. }
  300. // 新增:个人排名相关数据
  301. const rankingItems = ref<RankingItem[]>([])
  302. // 防止重复请求的标志位
  303. const isSearching = ref<boolean>(false)
  304. // 添加防重复刷新的标志
  305. const isRefreshing = ref<boolean>(false)
  306. // 添加刷新时间戳,用于防抖
  307. const lastRefreshTime = ref<number>(0)
  308. const tabbar = reactive([1,1,1,1])
  309. // 添加防抖定时器
  310. let searchTimer: number | null = null
  311. // 弹窗显示状态
  312. const showDatePickerPopup = ref<boolean>(false)
  313. const showDatePicker = ref<boolean>(false)
  314. // 工单状态字典列表
  315. const statusDictList = ref<SysDictData[]>([])
  316. // 维保类型字典列表
  317. const inspectionTypeDictList = ref<SysDictData[]>([])
  318. // 检修类型字典列表
  319. const maintenanceTypeDictList = ref<SysDictData[]>([])
  320. const dictLoaded = ref<boolean>(false)
  321. // 计算属性
  322. const monthTitle = computed(() => {
  323. switch (selectedMonth.value) {
  324. case 'prev':
  325. return '上月'
  326. case 'current':
  327. return '本月'
  328. case 'custom':
  329. // 显示自定义选择的年月
  330. return (customDate.value != null && customDate.value != '') ? customDate.value : '自定义'
  331. default:
  332. return '本月'
  333. }
  334. })
  335. // 根据索引获取排名圆圈的大小类(复制并修改自开屏页)
  336. const getRankingSizeClass = (index: number): string => {
  337. // size-1 对应最小的圆圈,size-3 对应最大的圆圈
  338. const size = Math.min(index + 1, 3);
  339. return `size-${size}`;
  340. };
  341. // 获取个人排名数据(复制并修改自开屏页)
  342. const fetchRankingData = async (): Promise<void> => {
  343. try {
  344. // 调用后端API获取用户数据
  345. const response = await selectHomePageData();
  346. // 根据响应结果更新rankingItems
  347. if (response != null) {
  348. const respObj = response as UTSJSONObject;
  349. const data = respObj['data'] as UTSJSONObject;
  350. // 初始化默认值
  351. let deptName = '未知部门';
  352. let center = '未知中心';
  353. let companyName = '未知公司';
  354. // 从scoreDept中提取部门、中心和公司名称
  355. if (data.hasOwnProperty('scoreDept') && Array.isArray(data['scoreDept']) && (data['scoreDept'] as any[]).length > 0) {
  356. const scoreDept = data['scoreDept'] as UTSJSONObject[];
  357. const firstItem = scoreDept[0];
  358. if (firstItem.hasOwnProperty('deptName')) {
  359. deptName = firstItem['deptName'] as string;
  360. }
  361. if (firstItem.hasOwnProperty('center')) {
  362. center = firstItem['center'] as string;
  363. }
  364. if (firstItem.hasOwnProperty('companyName')) {
  365. companyName = firstItem['companyName'] as string;
  366. }
  367. }
  368. // 更新排名信息
  369. const items : RankingItem[] = [];
  370. // 部门排名(东山电场)
  371. if (data.hasOwnProperty('deptSort') && data.hasOwnProperty('scoreDept')) {
  372. const deptSort = typeof data['deptSort'] === 'number' ? data['deptSort'] as number : 0;
  373. const scoreDept = Array.isArray(data['scoreDept']) ? data['scoreDept'] as any[] : [];
  374. // 只有当部门排序大于0且scoreDept数组不为空时才添加
  375. if (deptSort > 0 && scoreDept.length > 0) {
  376. items.push({
  377. name: deptName,
  378. rank: deptSort,
  379. total: scoreDept.length
  380. });
  381. }
  382. }
  383. // 中心排名(陆上设备维护中心)
  384. if (data.hasOwnProperty('centerSort') && data.hasOwnProperty('scoreCenter')) {
  385. const centerSort = typeof data['centerSort'] === 'number' ? data['centerSort'] as number : 0;
  386. const scoreCenter = Array.isArray(data['scoreCenter']) ? data['scoreCenter'] as any[] : [];
  387. // 只有当中心排序大于0且scoreCenter数组不为空时才添加
  388. if (centerSort > 0 && scoreCenter.length > 0) {
  389. items.push({
  390. name: center,
  391. rank: centerSort,
  392. total: scoreCenter.length
  393. });
  394. }
  395. }
  396. // 公司排名
  397. if (data.hasOwnProperty('companySort') && data.hasOwnProperty('scoreCompany')) {
  398. const companySort = typeof data['companySort'] === 'number' ? data['companySort'] as number : 0;
  399. const scoreCompany = Array.isArray(data['scoreCompany']) ? data['scoreCompany'] as any[] : [];
  400. // 只有当公司排序大于0且scoreCompany数组不为空时才添加
  401. if (companySort > 0 && scoreCompany.length > 0) {
  402. items.push({
  403. name: companyName,
  404. rank: companySort,
  405. total: scoreCompany.length
  406. });
  407. }
  408. }
  409. // 更新rankingItems
  410. rankingItems.value = items;
  411. }
  412. } catch (error) {
  413. console.error('获取用户排名数据失败:', error);
  414. }
  415. };
  416. // 新增:切换标签
  417. function switchTab(tab: string) {
  418. activeTab.value = tab;
  419. // 当切换到个人排名标签时,获取排名数据
  420. if (tab === 'ranking') {
  421. fetchRankingData();
  422. }
  423. }
  424. // 打开自定义日期选择弹窗
  425. function showCustomDatePicker() {
  426. showDatePickerPopup.value = true
  427. }
  428. function closeDatePicker() {
  429. showDatePicker.value = false
  430. showDatePickerPopup.value = false
  431. }
  432. // 打开日期选择器
  433. function openDatePicker() {
  434. showDatePicker.value = true
  435. }
  436. // 获取工单评分状态字典列表
  437. const loadStatusDictList = async (): Promise<void> => {
  438. try {
  439. const result = await getDictDataByType('gxt_scoring_status')
  440. const resultObj = result as UTSJSONObject
  441. if (resultObj['code'] == 200) {
  442. const data = resultObj['data'] as any[]
  443. const dictData: SysDictData[] = []
  444. if (data != null && data.length > 0) {
  445. for (let i = 0; i < data.length; i++) {
  446. const item = data[i] as UTSJSONObject
  447. // 只提取需要的字段
  448. const dictItem: SysDictData = {
  449. dictValue: item['dictValue'] as string | null,
  450. dictLabel: item['dictLabel'] as string | null,
  451. dictCode: null,
  452. dictSort: null,
  453. dictType: null,
  454. cssClass: null,
  455. listClass: null,
  456. isDefault: null,
  457. status: null,
  458. default: null,
  459. createTime: null,
  460. remark: null
  461. }
  462. dictData.push(dictItem)
  463. }
  464. }
  465. statusDictList.value = dictData
  466. }
  467. } catch (e: any) {
  468. console.error('获取工单评分状态字典失败:', e.message)
  469. }
  470. }
  471. // 获取维保类型字典列表
  472. const loadInspectionTypeDictList = async (): Promise<void> => {
  473. try {
  474. const result = await getDictDataByType('gxt_inspection_type')
  475. const resultObj = result as UTSJSONObject
  476. if (resultObj['code'] == 200) {
  477. const data = resultObj['data'] as any[]
  478. const dictData: SysDictData[] = []
  479. if (data != null && data.length > 0) {
  480. for (let i = 0; i < data.length; i++) {
  481. const item = data[i] as UTSJSONObject
  482. // 只提取需要的字段
  483. const dictItem: SysDictData = {
  484. dictValue: item['dictValue'] as string | null,
  485. dictLabel: item['dictLabel'] as string | null,
  486. dictCode: null,
  487. dictSort: null,
  488. dictType: null,
  489. cssClass: null,
  490. listClass: null,
  491. isDefault: null,
  492. status: null,
  493. default: null,
  494. createTime: null,
  495. remark: null
  496. }
  497. dictData.push(dictItem)
  498. }
  499. }
  500. inspectionTypeDictList.value = dictData
  501. }
  502. } catch (e: any) {
  503. console.error('获取维保类型字典失败:', e.message)
  504. }
  505. }
  506. // 获取检修类型字典列表
  507. const loadMaintenanceTypeDictList = async (): Promise<void> => {
  508. try {
  509. const result = await getDictDataByType('gxt_maintenance_type')
  510. const resultObj = result as UTSJSONObject
  511. if (resultObj['code'] == 200) {
  512. const data = resultObj['data'] as any[]
  513. const dictData: SysDictData[] = []
  514. if (data != null && data.length > 0) {
  515. for (let i = 0; i < data.length; i++) {
  516. const item = data[i] as UTSJSONObject
  517. // 只提取需要的字段
  518. const dictItem: SysDictData = {
  519. dictValue: item['dictValue'] as string | null,
  520. dictLabel: item['dictLabel'] as string | null,
  521. dictCode: null,
  522. dictSort: null,
  523. dictType: null,
  524. cssClass: null,
  525. listClass: null,
  526. isDefault: null,
  527. status: null,
  528. default: null,
  529. createTime: null,
  530. remark: null
  531. }
  532. dictData.push(dictItem)
  533. }
  534. }
  535. maintenanceTypeDictList.value = dictData
  536. }
  537. } catch (e: any) {
  538. console.error('获取检修类型字典失败:', e.message)
  539. }
  540. }
  541. // Helper function to safely extract properties from item
  542. function getPropertyValue(item: any | null, propertyName: string): string {
  543. if (item == null) return ''
  544. const itemObj = item as UTSJSONObject
  545. const value = itemObj[propertyName]
  546. return value != null ? '' + value : ''
  547. }
  548. // 获取工单类型文本
  549. function getWorkOrderTypeText(orderType: string | null): string {
  550. if (orderType != null) {
  551. if (orderType == "1") {
  552. return "维修工单"
  553. } else if (orderType == "2") {
  554. return "维保工单"
  555. }
  556. }
  557. return ""
  558. }
  559. // 获取工单类型相关信息(维保类型或检修类型)
  560. function getWorkOrderTypeInfo(item: any | null): string {
  561. if (item == null) return ''
  562. const orderType = getPropertyValue(item, 'orderType')
  563. // 维保工单显示维保类型
  564. if (orderType == "2") {
  565. const inspectionType = getPropertyValue(item, 'inspectionType')
  566. if (inspectionType != null && inspectionType != '') {
  567. // 如果字典尚未加载,返回原始值
  568. if (inspectionTypeDictList.value.length == 0) {
  569. return inspectionType
  570. }
  571. // 如果是逗号分隔的多个类型,将其分割并转换为标签
  572. if (inspectionType.includes(',')) {
  573. const typeIds = inspectionType.split(',')
  574. const labels: string[] = []
  575. for (const typeId of typeIds) {
  576. const dictItem = inspectionTypeDictList.value.find(dict => dict.dictValue == typeId.trim())
  577. labels.push(dictItem != null ? (dictItem.dictLabel ?? typeId) : typeId)
  578. }
  579. return labels.join(', ')
  580. } else {
  581. // 单个类型的情况
  582. const dictItem = inspectionTypeDictList.value.find(dict => dict.dictValue == inspectionType)
  583. return dictItem != null ? (dictItem.dictLabel ?? inspectionType) : inspectionType
  584. }
  585. }
  586. }
  587. // 维修工单显示检修类型
  588. else if (orderType == "1") {
  589. const maintenanceType = getPropertyValue(item, 'maintenanceType')
  590. if (maintenanceType != null && maintenanceType != '') {
  591. // 如果字典尚未加载,返回原始值
  592. if (maintenanceTypeDictList.value.length == 0) {
  593. return maintenanceType
  594. }
  595. // 查找字典中对应的标签
  596. const dictItem = maintenanceTypeDictList.value.find(dict => dict.dictValue == maintenanceType)
  597. return (dictItem != null ? dictItem.dictLabel : maintenanceType) as string
  598. }
  599. }
  600. return ""
  601. }
  602. // 获取工单状态文本
  603. function getScoringStatus(item: any | null): string | null {
  604. if (item == null) return ''
  605. const rawStatus = getPropertyValue(item, 'scoringStatus')
  606. if (rawStatus == null || rawStatus == '') return ''
  607. // 如果字典尚未加载,返回原始值
  608. if (!dictLoaded.value) {
  609. return rawStatus
  610. }
  611. // 查找字典中对应的标签
  612. const dictItem = statusDictList.value.find(dict => dict.dictValue == rawStatus)
  613. return dictItem != null ? dictItem.dictLabel : rawStatus
  614. }
  615. // 获取工单评分状态文本
  616. function getOrderStatusText(status: string | null): string {
  617. const statusMap: UTSJSONObject = {
  618. '1': '待自评',
  619. '2': '待复评',
  620. '3': '待确认',
  621. '4': '待终评'
  622. }
  623. if (status == null) return ''
  624. const result = statusMap[status]
  625. return result != null ? result as string : '未知状态'
  626. }
  627. // 获取统计数据
  628. function getStatistics() {
  629. // Convert 'current' and 'prev' values to actual date strings
  630. let monthValue = '';
  631. if (selectedMonth.value === 'custom') {
  632. monthValue = customDate.value;
  633. } else if (selectedMonth.value === 'current') {
  634. const now = new Date();
  635. monthValue = `${now.getFullYear()}-${(now.getMonth() + 1).toString().padStart(2, '0')}`;
  636. } else if (selectedMonth.value === 'prev') {
  637. const now = new Date();
  638. const prevMonth = now.getMonth(); // getMonth() returns 0-11
  639. const prevYear = prevMonth === 0 ? now.getFullYear() - 1 : now.getFullYear();
  640. const monthStr = prevMonth === 0 ? '12' : prevMonth.toString().padStart(2, '0');
  641. monthValue = `${prevYear}-${monthStr}`;
  642. }
  643. const params: UTSJSONObject = {
  644. //scoringStatus: statusFilter.value,
  645. month: monthValue
  646. }
  647. getOrderScoreStatistics(params).then((response: any) => {
  648. const resultObj = response as UTSJSONObject
  649. const responseData = resultObj['data'] as UTSJSONObject
  650. if (responseData != null) {
  651. totalScore.value = (responseData['totalScore'] != null) ? parseFloat((responseData['totalScore'] as number).toFixed(2)) : 0
  652. maintenanceScore.value = (responseData['maintenanceScore'] != null) ? parseFloat((responseData['maintenanceScore'] as number).toFixed(2)) : 0
  653. repairScore.value = (responseData['repairScore'] != null) ? parseFloat((responseData['repairScore'] as number).toFixed(2)) : 0
  654. rank.value = (responseData['rank'] != null) ? responseData['rank'] as number : null
  655. totalRankingUsers.value = (responseData['totalRankingUsers'] != null) ? responseData['totalRankingUsers'] as number : null
  656. } else {
  657. totalScore.value = 0
  658. maintenanceScore.value = 0
  659. repairScore.value = 0
  660. rank.value = null
  661. totalRankingUsers.value = null
  662. }
  663. })
  664. }
  665. function onDateConfirm(value: string) {
  666. customDate.value = value
  667. showDatePicker.value = false
  668. showDatePickerPopup.value = false
  669. selectedMonth.value = 'custom'
  670. // 添加防重复调用检查
  671. if (loading.value) {
  672. return;
  673. }
  674. getStatistics()
  675. }
  676. // 方法
  677. function loadData(isRefresh: boolean, disablePullDown = false) {
  678. // 防止重复请求的核心机制 - 参考工单页面的简单有效方式
  679. if (loading.value) {
  680. // 确保刷新状态最终被重置,防止卡死
  681. if (!isRefresh) {
  682. refreshing.value = false;
  683. }
  684. return
  685. }
  686. const shouldRefresh = isRefresh !== false
  687. loading.value = true
  688. if (shouldRefresh && !disablePullDown) {
  689. currentPage.value = 1
  690. refreshing.value = true
  691. } else if (shouldRefresh && disablePullDown) {
  692. // 筛选条件变化时,重置页码但不触发下拉刷新
  693. currentPage.value = 1
  694. // 即使禁用下拉刷新,也要确保刷新状态最终被重置
  695. refreshing.value = false
  696. } else {
  697. // 对于加载更多操作,不需要显示下拉刷新状态
  698. refreshing.value = false;
  699. }
  700. // Convert 'current' and 'prev' values to actual date strings
  701. let monthValue = '';
  702. if (selectedMonth.value === 'custom') {
  703. monthValue = customDate.value;
  704. } else if (selectedMonth.value === 'current') {
  705. const now = new Date();
  706. const m = now.getMonth() + 1
  707. let mStr = m.toString()
  708. if (m < 10) {
  709. mStr = '0' + mStr
  710. }
  711. monthValue = `${now.getFullYear()}-${mStr}`;
  712. } else if (selectedMonth.value === 'prev') {
  713. const now = new Date();
  714. const prevMonth = now.getMonth(); // getMonth() returns 0-11
  715. const prevYear = prevMonth === 0 ? now.getFullYear() - 1 : now.getFullYear();
  716. let monthStr = prevMonth === 0 ? '12' : prevMonth.toString()
  717. if (prevMonth !== 0 && prevMonth < 10) {
  718. monthStr = '0' + monthStr
  719. }
  720. monthValue = `${prevYear}-${monthStr}`;
  721. }
  722. const params: UTSJSONObject = {
  723. pageNum: currentPage.value,
  724. pageSize: 5,
  725. keyword: searchKeyword.value,
  726. scoringStatus: statusFilter.value,
  727. month: monthValue
  728. }
  729. listMobileOrderScores(params).then((response: any) => {
  730. // 提取响应数据
  731. const resultObj = response as UTSJSONObject
  732. console.log('API响应数据:', resultObj)
  733. const responseData = resultObj['rows'] as any[]
  734. const responseTotal = resultObj['total'] as number
  735. if (shouldRefresh) {
  736. orderList.value = Array.isArray(responseData) ? responseData : []
  737. } else {
  738. const currentRows = Array.isArray(responseData) ? responseData : []
  739. orderList.value = [...orderList.value, ...currentRows]
  740. }
  741. hasMore.value = orderList.value.length < responseTotal
  742. }).catch((error) => {
  743. console.error('获取工单列表失败:', error);
  744. // 出错时也需要重置刷新状态
  745. if (shouldRefresh) {
  746. refreshing.value = false;
  747. isRefreshing.value = false;
  748. }
  749. }).finally(() => {
  750. // 无论成功还是失败,都重置所有加载状态
  751. loading.value = false;
  752. // 确保刷新状态最终被重置
  753. if (shouldRefresh) {
  754. refreshing.value = false;
  755. // 使用setTimeout确保状态彻底重置
  756. setTimeout(() => {
  757. isRefreshing.value = false;
  758. }, 50);
  759. }
  760. })
  761. }
  762. function handleSearch() {
  763. // 添加防重复调用检查
  764. if (loading.value) {
  765. return;
  766. }
  767. // 添加防抖和防止重复请求
  768. if (isSearching.value) {
  769. return
  770. }
  771. const timer = searchTimer
  772. if (timer != null) {
  773. clearTimeout(timer)
  774. searchTimer = null
  775. }
  776. searchTimer = setTimeout(() => {
  777. isSearching.value = true
  778. loadData(true, true); // 添加true参数表示这是筛选条件变化触发的加载,应禁用下拉刷新
  779. // 延迟重置标志位,确保请求发送后才允许下一次搜索
  780. setTimeout(() => {
  781. isSearching.value = false
  782. }, 100)
  783. }, 300)
  784. }
  785. function clearSearch() {
  786. // 添加防重复调用检查
  787. if (loading.value) {
  788. return;
  789. }
  790. // 添加防抖和防止重复请求
  791. if (isSearching.value) {
  792. return
  793. }
  794. const timer = searchTimer
  795. if (timer != null) {
  796. clearTimeout(timer)
  797. searchTimer = null
  798. }
  799. searchKeyword.value = ""
  800. searchTimer = setTimeout(() => {
  801. isSearching.value = true
  802. loadData(true, true); // 添加true参数表示这是筛选条件变化触发的加载,应禁用下拉刷新
  803. // 延迟重置标志位,确保请求发送后才允许下一次搜索
  804. setTimeout(() => {
  805. isSearching.value = false
  806. }, 100)
  807. }, 300)
  808. }
  809. function filterByStatus(status: string) {
  810. // 添加防重复调用检查
  811. if (loading.value) {
  812. return;
  813. }
  814. // 添加防止重复请求
  815. if (isSearching.value) {
  816. return
  817. }
  818. const timer = searchTimer
  819. if (timer != null) {
  820. clearTimeout(timer)
  821. searchTimer = null
  822. }
  823. statusFilter.value = status
  824. searchTimer = setTimeout(() => {
  825. isSearching.value = true
  826. loadData(true, true); // 添加true参数表示这是筛选条件变化触发的加载,应禁用下拉刷新
  827. getStatistics()
  828. // 延迟重置标志位,确保请求发送后才允许下一次搜索
  829. setTimeout(() => {
  830. isSearching.value = false
  831. }, 100)
  832. }, 300)
  833. }
  834. function changeMonth(month: string) {
  835. // 添加防重复调用检查
  836. if (loading.value) {
  837. return;
  838. }
  839. // 添加防止重复请求
  840. if (isSearching.value) {
  841. return
  842. }
  843. const timer = searchTimer
  844. if (timer != null) {
  845. clearTimeout(timer)
  846. searchTimer = null
  847. }
  848. selectedMonth.value = month
  849. searchTimer = setTimeout(() => {
  850. getStatistics()
  851. }, 300)
  852. }
  853. function loadMore() {
  854. console.log("loadMore被触发")
  855. if (!hasMore.value || loading.value) return
  856. currentPage.value++
  857. loadData(false)
  858. }
  859. function handleRefresh() {
  860. console.log("handleRefresh被触发")
  861. console.log("loading.value===",loading.value)
  862. console.log("isRefreshing.value===",isRefreshing.value)
  863. // 防抖处理,避免频繁触发
  864. const now = Date.now();
  865. if (now - lastRefreshTime.value < 1000) {
  866. console.log("刷新操作过于频繁,忽略本次触发");
  867. refreshing.value = false;
  868. return;
  869. }
  870. lastRefreshTime.value = now;
  871. // 添加防重复调用检查
  872. if (loading.value || isRefreshing.value) {
  873. // 如果已经在加载或正在刷新,直接重置刷新状态
  874. refreshing.value = false;
  875. return;
  876. }
  877. console.log("loading.value1===",loading.value)
  878. console.log("isRefreshing.value1===",isRefreshing.value)
  879. // 设置刷新标志
  880. isRefreshing.value = true;
  881. loadData(true); // 使用默认的下拉刷新行为
  882. // 确保在一定时间后重置刷新标志,防止意外情况
  883. setTimeout(() => {
  884. isRefreshing.value = false
  885. }, 100) // 延迟重置,确保状态完全更新
  886. }
  887. // 点击列表项
  888. function handleItemClick(item: any | null, index: number): void {
  889. if (item == null) return
  890. const itemObj = item as UTSJSONObject
  891. const id = itemObj.get('id')
  892. const orderType = itemObj.get('orderType')
  893. if (id != null && orderType != null) {
  894. // 转换为字符串
  895. const idStr = '' + id
  896. const orderTypeStr = '' + orderType
  897. uni.navigateTo({
  898. url: `/pages/score/detail/index?id=${idStr}&orderType=${orderTypeStr}`
  899. })
  900. }
  901. }
  902. // 评分操作按钮点击事件
  903. function handleScoreClick(item: any | null, operationType: string): void {
  904. if (item == null) return
  905. const itemObj = item as UTSJSONObject
  906. const id = itemObj.get('id')
  907. const orderType = itemObj.get('orderType')
  908. if (id != null && orderType != null) {
  909. const idStr = '' + id
  910. const orderTypeStr = '' + orderType
  911. if (operationType === 'self') {
  912. // 自评操作:跳转到自评页面
  913. uni.navigateTo({
  914. url: `/pages/score/detail/selfEvaluate?id=${idStr}&orderType=${orderTypeStr}`
  915. })
  916. } else if (operationType === 're') {
  917. // 复评操作:跳转到复评页面
  918. uni.navigateTo({
  919. url: `/pages/score/detail/reEvaluate?id=${idStr}&orderType=${orderTypeStr}`
  920. })
  921. }
  922. }
  923. }
  924. // 判断是否显示评分操作按钮 - 与工单页面类似的方式
  925. function canHandleScore(item: any | null, operationType: string): boolean {
  926. if (item == null) return false
  927. const scoringStatus = getPropertyValue(item, 'scoringStatus')
  928. // 根据评分状态和操作类型决定是否显示操作按钮
  929. if (operationType === 'self' && (scoringStatus === 'to_self' || scoringStatus === 'returned')) {
  930. // 自评操作:状态为to_self或returned时显示
  931. return true
  932. } else if (operationType === 're' && scoringStatus === 'to_re') {
  933. // 复评操作:状态为to_re时显示
  934. return true
  935. }
  936. return false
  937. }
  938. function formatNumber(value: number | null) {
  939. if (value === null) return '0.0'
  940. return value.toFixed(2)
  941. }
  942. // 获取工单评分状态样式类
  943. function getStatusClass(item: any | null): string {
  944. if (item == null) return ''
  945. const rawStatus = getPropertyValue(item, 'scoringStatus')
  946. if (rawStatus == null || rawStatus == '') return ''
  947. return `status-${rawStatus}`
  948. }
  949. function formatDate(dateString: string) {
  950. if (dateString == '' || dateString == null) return ''
  951. const date = new Date(dateString)
  952. const year = date.getFullYear()
  953. const month = (date.getMonth() + 1).toString().padStart(2, '0')
  954. const day = date.getDate().toString().padStart(2, '0')
  955. const hours = date.getHours().toString().padStart(2, '0')
  956. const minutes = date.getMinutes().toString().padStart(2, '0')
  957. return `${year}-${month}-${day} ${hours}:${minutes}`
  958. }
  959. // 生命周期
  960. //onMounted(() => {
  961. onLoad((options: any) => {
  962. // 检查权限设置tabbar
  963. tabbar[2] = checkPermi(['gxt:app:worktime']) ? 1 : 0
  964. tabbar[3] = checkPermi(['gxt:app:score']) ? 1 : 0
  965. loadStatusDictList()
  966. loadInspectionTypeDictList()
  967. loadMaintenanceTypeDictList()
  968. loadData(false)
  969. getStatistics()
  970. dictLoaded.value = true
  971. // 获取初始排名数据
  972. fetchRankingData();
  973. })
  974. // 页面显示时检查是否需要刷新数据
  975. onShow(() => {
  976. // 检查是否有来自子页面的刷新标记
  977. const needRefresh = uni.getStorageSync('needRefresh')
  978. if (needRefresh === true) {
  979. // 清除标记
  980. uni.removeStorageSync('needRefresh')
  981. // 延迟执行刷新,确保页面完全加载后再刷新数据
  982. setTimeout(() => {
  983. handleRefresh()
  984. }, 500)
  985. }
  986. })
  987. // 组件销毁时清除定时器
  988. onBeforeUnmount(() => {
  989. const timer = searchTimer
  990. if (timer != null) {
  991. clearTimeout(timer)
  992. searchTimer = null
  993. }
  994. // 如果组件销毁前还有未完成的刷新操作,确保状态被重置
  995. loading.value = false;
  996. refreshing.value = false;
  997. isRefreshing.value = false;
  998. })
  999. // 获取排名类型(dept, center, company)
  1000. function getRankingType(index: number): string {
  1001. // 根据索引返回对应的排名类型
  1002. if (index === 0) return 'dept';
  1003. if (index === 1) return 'center';
  1004. if (index === 2) return 'company';
  1005. return 'dept'; // 默认返回部门排名
  1006. }
  1007. // 跳转到排名详情页面
  1008. function goToRankingDetail(type: string) {
  1009. console.log("type======",type)
  1010. uni.navigateTo({
  1011. url: `/pages/score/ranking?type=${type}`
  1012. })
  1013. }
  1014. </script>
  1015. <style lang="scss">
  1016. .list-page {
  1017. flex: 1;
  1018. background-color: #e8f0f9;
  1019. padding-bottom: 150rpx; // 为底部 TabBar 留出空间
  1020. }
  1021. /* 搜索栏样式 */
  1022. .search-bar {
  1023. padding: 20rpx 30rpx;
  1024. background-color: #d7eafe;
  1025. }
  1026. .search-box {
  1027. flex-direction: row;
  1028. align-items: center;
  1029. height: 72rpx;
  1030. padding: 0 24rpx;
  1031. background-color: #f5f5f5;
  1032. border-radius: 36rpx;
  1033. .search-icon {
  1034. width: 32rpx;
  1035. height: 32rpx;
  1036. margin-right: 12rpx;
  1037. }
  1038. .search-input {
  1039. flex: 1;
  1040. font-size: 28rpx;
  1041. color: #333333;
  1042. }
  1043. .clear-icon {
  1044. margin-left: 12rpx;
  1045. font-size: 28rpx;
  1046. color: #999999;
  1047. }
  1048. }
  1049. /* 工单状态筛选 */
  1050. .status-bar {
  1051. padding-bottom: 10px;
  1052. padding-left: 30rpx;
  1053. background-color: #d7eafe;
  1054. }
  1055. .status-box {
  1056. flex-direction: row;
  1057. align-items: center;
  1058. height: 72rpx;
  1059. flex: 1;
  1060. .status-txt {
  1061. padding: 8px 12px;
  1062. text-align: center;
  1063. margin-right: 12rpx;
  1064. border-radius: 36rpx;
  1065. background-color: #fff;
  1066. font-size: 28rpx;
  1067. }
  1068. .stauts-sel {
  1069. background-color: #007AFF;
  1070. color: #fff;
  1071. }
  1072. }
  1073. .scroll-view_H {
  1074. width: 100%;
  1075. flex-direction: row;
  1076. }
  1077. .scroll-view-item_H {
  1078. justify-content: center;
  1079. align-items: center;
  1080. margin-right: 12rpx;
  1081. .status-txt {
  1082. padding: 8px 12px;
  1083. text-align: center;
  1084. border-radius: 36rpx;
  1085. background-color: #fff;
  1086. font-size: 28rpx;
  1087. }
  1088. .stauts-sel {
  1089. background-color: #007AFF;
  1090. color: #fff;
  1091. }
  1092. }
  1093. /* 工分统计 */
  1094. .stats-section {
  1095. margin: 15rpx 30rpx;
  1096. background-color: #ffffff;
  1097. border-radius: 16rpx;
  1098. padding: 20rpx;
  1099. }
  1100. /* 标签切换样式 */
  1101. .stats-tabs {
  1102. display: flex;
  1103. flex-direction: row;
  1104. border-bottom: 2rpx solid #f0f0f0;
  1105. margin-bottom: 20rpx;
  1106. }
  1107. .tab-item {
  1108. padding: 15rpx 30rpx;
  1109. font-size: 30rpx;
  1110. color: #666;
  1111. position: relative;
  1112. }
  1113. .tab-active {
  1114. color: #165dff;
  1115. font-weight: bold;
  1116. }
  1117. .tab-active::after {
  1118. position: absolute;
  1119. bottom: -2rpx;
  1120. left: 0;
  1121. right: 0;
  1122. height: 6rpx;
  1123. background-color: #165dff;
  1124. border-radius: 3rpx;
  1125. }
  1126. .stats-header {
  1127. flex-direction: row;
  1128. justify-content: space-between;
  1129. align-items: center;
  1130. margin-bottom: 20rpx;
  1131. }
  1132. .stats-title {
  1133. font-size: 32rpx;
  1134. font-weight: bold;
  1135. flex: 1;
  1136. }
  1137. .month-filters {
  1138. flex-direction: row;
  1139. justify-content: flex-end;
  1140. display: flex;
  1141. }
  1142. .month-tab {
  1143. white-space: nowrap;
  1144. margin: 0 8rpx;
  1145. border-radius: 24rpx;
  1146. background-color: #f2f3f5;
  1147. }
  1148. .month-filter {
  1149. padding: 6rpx 12rpx;
  1150. font-size: 24rpx;
  1151. color: #666;
  1152. }
  1153. .month-filter-sel {
  1154. background-color: #165dff;
  1155. color: white;
  1156. }
  1157. .stats-content {
  1158. margin-top: 20rpx;
  1159. flex-direction: column;
  1160. }
  1161. .total-score {
  1162. margin-bottom: 30rpx;
  1163. flex-direction: column;
  1164. align-items: center;
  1165. }
  1166. .score-label {
  1167. font-size: 28rpx;
  1168. color: #666;
  1169. display: flex;
  1170. margin-bottom: 8rpx;
  1171. }
  1172. .score-value {
  1173. display: flex;
  1174. font-size: 48rpx;
  1175. font-weight: bold;
  1176. color: #165dff;
  1177. line-height: 1.2;
  1178. }
  1179. .score-breakdown {
  1180. flex-direction: row;
  1181. justify-content: space-between;
  1182. }
  1183. .breakdown-item {
  1184. flex: 1;
  1185. flex-direction: column;
  1186. align-items: center;
  1187. }
  1188. .breakdown-label {
  1189. display: flex;
  1190. font-size: 32rpx;
  1191. font-weight: bold;
  1192. color: #333;
  1193. line-height: 1.4;
  1194. }
  1195. .breakdown-value {
  1196. font-size: 28rpx;
  1197. color: #666;
  1198. display: flex;
  1199. margin-bottom: 8rpx;
  1200. }
  1201. /* 列表项样式 */
  1202. .list-item {
  1203. margin: 12rpx 30rpx;
  1204. background-color: #ffffff;
  1205. border-radius: 16rpx;
  1206. }
  1207. .item-container {
  1208. padding: 30rpx;
  1209. }
  1210. .item-header {
  1211. flex-direction: row;
  1212. align-items: flex-start;
  1213. margin-bottom: 16rpx;
  1214. .item-title {
  1215. font-size: 30rpx;
  1216. color: #333333;
  1217. font-weight: bold;
  1218. flex-wrap: wrap;
  1219. flex: 0 1 70%;
  1220. min-width: 0;
  1221. }
  1222. .info-value {
  1223. font-size: 28rpx;
  1224. color: #999999;
  1225. margin-left: auto;
  1226. flex: 0 0 auto;
  1227. white-space: nowrap;
  1228. }
  1229. }
  1230. .info-row {
  1231. flex-direction: row;
  1232. justify-content: space-between;
  1233. align-items: center;
  1234. .info-label {
  1235. font-size: 26rpx;
  1236. color: #666;
  1237. }
  1238. .info-value-row {
  1239. flex-direction: row;
  1240. align-items: center;
  1241. }
  1242. .score-text {
  1243. font-size: 28rpx;
  1244. color: #ff9900;
  1245. font-weight: bold;
  1246. margin-right: 20rpx;
  1247. }
  1248. .status-text {
  1249. font-size: 24rpx;
  1250. padding: 4rpx 10rpx;
  1251. border-radius: 24rpx;
  1252. background-color: #f2f3f5;
  1253. color: #666;
  1254. }
  1255. }
  1256. .text-gray{
  1257. font-size: 26rpx;
  1258. color: #666;
  1259. }
  1260. /* 日期选择弹窗 */
  1261. .date-picker-popup {
  1262. background-color: white;
  1263. border-top-left-radius: 30rpx;
  1264. border-top-right-radius: 30rpx;
  1265. padding: 40rpx;
  1266. // padding-bottom: 40rpx;
  1267. // margin-bottom: 150rpx; /* 提高弹窗,避免被底部导航栏遮挡 */
  1268. min-height: 750rpx;
  1269. box-sizing: border-box; // 确保padding不撑大容器
  1270. }
  1271. .popup-header {
  1272. display: flex;
  1273. justify-content: space-between;
  1274. align-items: center;
  1275. margin-bottom: 40rpx;
  1276. width: 100%;
  1277. }
  1278. .popup-title {
  1279. font-size: 34rpx;
  1280. font-weight: bold;
  1281. flex: 1;
  1282. white-space: nowrap;
  1283. overflow: hidden;
  1284. text-overflow: ellipsis;
  1285. }
  1286. .popup-actions {
  1287. display: flex;
  1288. flex-direction: row;
  1289. white-space: nowrap;
  1290. flex: 0 0 auto;
  1291. }
  1292. .popup-btn {
  1293. white-space: nowrap;
  1294. flex: 0 0 auto; // 不伸缩,保持原有宽度
  1295. }
  1296. .cancel-btn {
  1297. color: #999;
  1298. padding: 10rpx 20rpx;
  1299. font-size: 30rpx;
  1300. font-weight: bold;
  1301. // 核心修复:强制文字不换行
  1302. white-space: nowrap !important;
  1303. // 可选:固定按钮最小宽度,避免极端情况挤压
  1304. min-width: 120rpx;
  1305. text-align: center;
  1306. }
  1307. .confirm-btn {
  1308. color: #165dff;
  1309. padding: 10rpx 20rpx;
  1310. font-weight: bold;
  1311. }
  1312. .date-picker-container {
  1313. padding: 20rpx 0;
  1314. padding-bottom: env(safe-area-inset-bottom); // 适配安全区域
  1315. }
  1316. .date-picker-item {
  1317. margin-bottom: 40rpx;
  1318. }
  1319. .date-label {
  1320. display: flex;
  1321. margin-bottom: 20rpx;
  1322. font-size: 30rpx;
  1323. color: #333;
  1324. }
  1325. .date-display {
  1326. width: 100%;
  1327. padding: 20rpx;
  1328. border: 2rpx solid #ddd;
  1329. border-radius: 8rpx;
  1330. font-size: 32rpx;
  1331. color: #333;
  1332. }
  1333. // 添加底部填充的类
  1334. .list-with-padding {
  1335. padding-bottom: 40rpx;
  1336. }
  1337. /* 工单评分状态标签样式 */
  1338. .status-tag {
  1339. padding: 8rpx 20rpx;
  1340. border-radius: 20rpx;
  1341. font-size: 24rpx;
  1342. white-space: nowrap;
  1343. margin-left: 70rpx;
  1344. border: 1rpx solid;
  1345. }
  1346. /* 待自评 */
  1347. .status-to_self {
  1348. background-color: #fff7e6;
  1349. color: #fa8c16;
  1350. border-color: #ffd591;
  1351. }
  1352. /* 待复评 */
  1353. .status-to_re {
  1354. background-color: #ebf5ff;
  1355. color: #409eff;
  1356. border-color: #d8ebff;
  1357. }
  1358. /* 待确认 */
  1359. .status-to_confirm {
  1360. background-color: #f0f9eb;
  1361. color: #5cb87a;
  1362. border-color: #c2e7b0;
  1363. }
  1364. /* 待终评 */
  1365. .status-to_final {
  1366. background-color: #ebf5ff;
  1367. color: #409eff;
  1368. border-color: #d8ebff;
  1369. }
  1370. /* 待归档 */
  1371. .status-to_archive {
  1372. background-color: #f0f9eb;
  1373. color: #5cb87a;
  1374. border-color: #c2e7b0;
  1375. }
  1376. /* 已归档 */
  1377. .status-archived {
  1378. background-color: #f0f9eb;
  1379. color: #5cb87a;
  1380. border-color: #c2e7b0;
  1381. }
  1382. /* 申诉中 */
  1383. .status-appealing {
  1384. background-color: #ffcfc2;
  1385. color: #ff0000;
  1386. border-color: #ff7446;
  1387. }
  1388. /* 已退回 */
  1389. .status-returned {
  1390. background-color: #ffcfc2;
  1391. color: #ff0000;
  1392. border-color: #ff7446;
  1393. }
  1394. /* 个人排名模块样式 */
  1395. .ranking-item-wrapper {
  1396. padding: 5rpx 30rpx;
  1397. margin-bottom: 5rpx;
  1398. background: transparent;
  1399. }
  1400. .ranking-item {
  1401. display: flex;
  1402. flex-direction: row;
  1403. align-items: center;
  1404. width: 100%;
  1405. padding: 10rpx 0;
  1406. }
  1407. .module-title {
  1408. color: #ffffff;
  1409. font-size: 36rpx;
  1410. font-weight: bold;
  1411. margin-bottom: 0;
  1412. text-align: center;
  1413. }
  1414. .ranking-item {
  1415. display: flex;
  1416. flex-direction: row;
  1417. align-items: center;
  1418. width: 100%;
  1419. padding-left: 0;
  1420. margin-left: 0;
  1421. }
  1422. .ranking-name {
  1423. color: #000000;
  1424. font-size: 32rpx;
  1425. font-weight: normal;
  1426. flex: 1;
  1427. margin-left: 20rpx;
  1428. }
  1429. .ranking-number {
  1430. background: #38bdf8;
  1431. display: flex;
  1432. align-items: center;
  1433. justify-content: center;
  1434. }
  1435. .ranking-circle-wrapper {
  1436. width: 100rpx;
  1437. display: flex;
  1438. justify-content: center;
  1439. align-items: center;
  1440. }
  1441. .ranking-number.size-1 {
  1442. width: 60rpx;
  1443. height: 60rpx;
  1444. border-radius: 30rpx;
  1445. }
  1446. .ranking-number.size-2 {
  1447. width: 70rpx;
  1448. height: 70rpx;
  1449. border-radius: 35rpx;
  1450. }
  1451. .ranking-number.size-3 {
  1452. width: 80rpx;
  1453. height: 80rpx;
  1454. border-radius: 40rpx;
  1455. }
  1456. .ranking-number-text {
  1457. color: #ffffff;
  1458. font-weight: normal;
  1459. text-align: center;
  1460. font-size: 28rpx;
  1461. }
  1462. .ranking-number.size-1 .ranking-number-text {
  1463. font-size: 18rpx;
  1464. }
  1465. .ranking-number.size-2 .ranking-number-text {
  1466. font-size: 20rpx;
  1467. }
  1468. .ranking-number.size-3 .ranking-number-text {
  1469. font-size: 22rpx;
  1470. }
  1471. .ranking-label {
  1472. color: #ff0000;
  1473. font-size: 32rpx;
  1474. white-space: nowrap;
  1475. margin-left: 20rpx;
  1476. }
  1477. .no-data {
  1478. display: flex;
  1479. justify-content: center;
  1480. align-items: center;
  1481. height: 200rpx;
  1482. }
  1483. .no-data-text {
  1484. font-size: 28rpx;
  1485. color: #999;
  1486. }
  1487. .btn-primary {
  1488. z-index: 999;
  1489. border-radius: 10rpx;
  1490. font-size: 24rpx;
  1491. margin-left: 20rpx;
  1492. background-color: #165DFF;
  1493. line-height: 45rpx;
  1494. color: #ffffff;
  1495. .btn-text{
  1496. color: #ffffff;
  1497. font-size: 24rpx;
  1498. padding: 5px 15px;
  1499. }
  1500. }
  1501. .btn-group {
  1502. flex-direction: row;
  1503. align-items: center;
  1504. justify-content: flex-end;
  1505. margin-top: 20rpx;
  1506. }
  1507. </style>