index.uvue 47 KB

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