index.vue 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839
  1. <template>
  2. <view v-if="isMaskShow" class="mask">
  3. </view>
  4. <view class="uni-column" style="height: 100%; background-color: #f5f5f5;">
  5. <view class="box-bg uni-row">
  6. <view class="input-view uni-row">
  7. <uni-icons class="input-uni-icon" type="search" size="18" color="#999" />
  8. <input class="nav-bar-input" type="text" v-model="keywords" placeholder="请输入批次号/箱号" />
  9. </view>
  10. <view class="search" @click="handleSearch">
  11. 搜索
  12. </view>
  13. </view>
  14. <view class="list-title uni-row">
  15. <!-- <div class="list-title uni-row"> -->
  16. <text class="label">是否正常批次</text>
  17. <text>{{ normalStatus ? '是' : '否' }}</text>
  18. <switch class="switch" :checked="normalStatus" @change="switchChange" color="rgba(255,85,85,1)" />
  19. <!-- <text>{{ }}</text> -->
  20. <!-- </div> -->
  21. <!-- <text class="label">是否正常批次</text><text>是</text>
  22. <switch class="switch" @change="switchChange" color="rgba(255,85,85,1)" />
  23. <text>否</text> -->
  24. </view>
  25. <view class="scroll-container" style="padding-bottom: 150rpx">
  26. <view v-if="listData.length == 0" style="color: #999;margin: 50% auto;">
  27. <text>暂无批次</text>
  28. </view>
  29. <!-- 批次列表 -->
  30. <view v-else v-for="(item, index) in listData" :key="index" class="list-item"
  31. @click="handleToreportingForWork(item)">
  32. <view class="title-container uni-row" style="justify-content: flex-start;">
  33. <view class="title uni-row">
  34. <text class="label">批次号:</text>
  35. <text class="label code">{{ item['lotCode'] }}</text>
  36. </view>
  37. <view class=" uni-row" style="margin-left: 16rpx;">
  38. <view v-if="item['status'] == 1" class="tag"><text class="label">进行中</text></view>
  39. <view v-else-if="item['status'] == 3" class="tag turnover "><text class="label">周转中</text>
  40. </view>
  41. <view v-else-if="item['status'] == 2" class="tag turnover "><text class="label">待周转</text>
  42. </view>
  43. <view v-else-if="item['status'] == 0" class="tag finished "><text class="label">未开始</text>
  44. </view>
  45. <view v-else-if="item['status'] == 4" type="default finished" class="tag finished"><text
  46. class="label">已完成</text></view>
  47. </view>
  48. </view>
  49. <view class="item-info uni-row">
  50. <text class="label">产品描述</text>
  51. <text class="label right">{{ curPlan['productDescription'] }}</text>
  52. </view>
  53. <view class="item-info uni-row">
  54. <text class="label">材质</text>
  55. <text
  56. class="label right">{{ item['furnaceNoInfo'] && item['furnaceNoInfo'].firstTechnicalRequirement != '' ? item['furnaceNoInfo'].firstTechnicalRequirement + ";" + item['furnaceNoInfo'].secondTechnicalRequirement : '-' }}</text>
  57. </view>
  58. <view class="item-info uni-row">
  59. <text class="label">箱号</text>
  60. <text class="label right">{{ item['carrierName'] ? item['carrierName'] : '-' }}</text>
  61. </view>
  62. <!-- <view class="item-info uni-row">
  63. <text class="label">总工时</text>
  64. <text class="label right">{{ item['totalWorkingHours']}}</text>
  65. </view> -->
  66. <view class="item-info uni-row">
  67. <text class="label">投入数</text>
  68. <text
  69. class="label right">{{ item.prevProcess == null ? item['productionQuantity'] : item['processQualifiedNum']}}</text>
  70. </view>
  71. <view class="item-info uni-row">
  72. <text class="label">上道工序</text>
  73. <text class="label right">{{ item.prevProcess ? item['prevProcess'].processAlias : '-'}}</text>
  74. </view>
  75. <view class="item-info uni-row">
  76. <text class="label">当前工序</text>
  77. <text
  78. class="label right">{{ item.currentProcess ? item.prevProcess && item['currentProcess'].processAlias == item['prevProcess'].processAlias ? '-' : item['currentProcess'].processAlias : '-'}}</text>
  79. </view>
  80. <view class="item-info uni-row">
  81. <text class="label">下道工序</text>
  82. <view class="label right uni-row">
  83. {{ item.nextProcess ? item['nextProcess'].processAlias : '-' }}
  84. (<view style="color: #1684fc;" @click.stop="handleClickProcessList(item)">&nbsp;工艺列表&nbsp;
  85. </view>)
  86. </view>
  87. </view>
  88. <!-- <view class="item-info uni-row">
  89. <text class="label">设备</text>
  90. <text class="label right">{{ curPlan['equipmentName'] }}</text>
  91. </view> -->
  92. <view v-if="notPreProcess" class="item-info uni-row">
  93. <text class="label">所在区域</text>
  94. <text class="label right">{{ item['place'] ? item['place'] : '-' }}</text>
  95. </view>
  96. <view v-if="item.protemResourceGroupDetailList && item.protemResourceGroupDetailList.length>0"
  97. class="item-info uni-row">
  98. <text class="label">邀请者</text>
  99. <text
  100. class="label right">{{ item['protemResourceGroupDetailList'] && item['protemResourceGroupDetailList'].length>0 ? item['protemResourceGroupDetailList'][0].protemCreatorName : '-' }}</text>
  101. </view>
  102. <view v-if="item.protemResourceGroupDetailList&& item.protemResourceGroupDetailList.length>0"
  103. class="item-info uni-row">
  104. <text class="label">已完成数量</text>
  105. <text class="label right">{{ item['totalQuantity'] ? item['totalQuantity'] : 0 }}</text>
  106. </view>
  107. <view class="status-btn uni-row">
  108. <view v-if="item['status'] == 2" class=" uni-row">
  109. <button class="turnover-tag" size="mini"
  110. @click.stop="handleShowTurnoverApplication(item)">周转申请</button>
  111. <!-- <button class="reporting-tag" size="mini" @click="handleToreportingForWork">去报工</button> -->
  112. </view>
  113. <view v-else-if="item['status'] == 3" class=" uni-row">
  114. <button class="turnover-tag" size="mini" @click.stop="handleCancelTurnover(item)"
  115. style="background-color: rgba(255, 85, 85, 1);">取消周转</button>
  116. </view>
  117. </view>
  118. </view>
  119. </view>
  120. <!-- 抽屉 -->
  121. <uni-drawer ref="showRight" mode="right" :mask-click="true">
  122. <view style="text-align: center; font-size: 48rpx; padding: 48rpx 0 24rpx 0;">工艺列表</view>
  123. <view style="font-size: 24rpx;text-align: center;color: red; margin-bottom: 16rpx;">
  124. 仅显示当前工序后面工艺
  125. </view>
  126. <scroll-view scroll-y="true" style="height: 82%;" @touchmove.stop>
  127. <view v-for="(item,index) in curProcessAfte" :key="index"
  128. style="padding: 8rpx 5% 8rpx 14%; border-top: 1px solid #cccccc">
  129. <text>{{ index + 1 }}.{{item.processAlias}}</text>
  130. </view>
  131. </scroll-view>
  132. <view><button v-if="!editStatus" class="view-end-btn" type="primary" @click="handleOpenDrawing">查看本工序图纸</button></view>
  133. </uni-drawer>
  134. <!-- <view v-if="bottomStatus" class="bottom uni-row">
  135. <button class="start-batch-btn" type="primary" @click="handleStartNewBatch">开始新批次</button>
  136. </view>
  137. <view v-if="!bottomStatus" class="bottom uni-row">
  138. <button class="start-batch-btn" type="primary" @click="handleScanCode">扫一扫开始新批次</button>
  139. </view> -->
  140. <view class="bottom uni-row">
  141. <button v-if="bottomStatus" class="start-batch-btn" style="margin-right: 10rpx;" type="primary"
  142. @click="handleStartNewBatch">开始新批次</button>
  143. <button class="start-batch-btn" style="margin-right: 10rpx;" type="primary"
  144. @click="handleScanCode">扫码开始批次</button>
  145. <button class="start-batch-btn" type="primary" @click="handleSearchCode">查箱号</button>
  146. </view>
  147. <dialog-lot ref="lotDialog" @submit="handleDoIt" />
  148. <dialog-turnoverApplication ref="turnoverApplicationDialog" @reflushDaywork="handleDoTurnoverAfter" />
  149. <dialog-selectProduction ref="selectProduction"></dialog-selectProduction>
  150. </view>
  151. </template>
  152. <script setup>
  153. import {
  154. normalizeProps,
  155. reactive,
  156. onMounted,
  157. ref
  158. } from 'vue'
  159. import {
  160. onLoad,
  161. onReady,
  162. onUnload,
  163. onShow
  164. } from '@dcloudio/uni-app'
  165. import {
  166. getDayWorkList,
  167. showDaywork,
  168. showDayworkSave,
  169. turnoverDelete
  170. } from '@/api/business/dayWork.js'
  171. import {
  172. getAbnormalityLot
  173. } from '@/api/business/lot.js'
  174. import {
  175. carrierFinishedCheck
  176. } from '@/api/business/carrier.js'
  177. import {
  178. store
  179. } from '@/store/index.js'
  180. import {
  181. toHHmmss
  182. } from '@/utils/common.js'
  183. import {
  184. onPullDownRefresh
  185. } from "@dcloudio/uni-app"
  186. const turnoverApplicationDialog = ref(null)
  187. const selectProduction = ref(null)
  188. const lotDialog = ref(null)
  189. const listData = ref([])
  190. const curPlan = ref(null)
  191. const bizDayworkObj = ref({})
  192. const bottomStatus = ref(false) // 底部按钮显示
  193. const paging = ref();
  194. const reqParam = ref(null);
  195. const normalStatus = ref(true)
  196. const isLoding = ref(false);
  197. const curDayworkItem = ref({}) // 当前报工记录,回显是否显示取消周转的状态
  198. const keywords = ref(null)
  199. const tempList = ref([])
  200. const wasteRecyclingList = ref([]) //废品回用批次
  201. // 在数据中定义一个变量来控制遮罩层的显示
  202. const isMaskShow = ref(false);
  203. //打开图纸
  204. //选中的daywork
  205. const currentDaywork = ref({})
  206. const editStatus = ref(false)
  207. const notPreProcess = ref(true)
  208. const curProcessAfte = ref([])
  209. const showRight = ref(null) // 抽屉
  210. onLoad(() => {
  211. curPlan.value = store.planDetails;
  212. normalStatus.value = true;
  213. console.log(curPlan.value)
  214. //废品回用的领料部门如果是当前工段,也要可以开始新批次
  215. //查找当前计划单下的批次废品回用是当前工段
  216. getAbnormalityLot({
  217. productionPlanDetailId: store.planDetails.id,
  218. requisitionDepartmentId: store.curDeptDetails.deptId
  219. }).then(res => {
  220. wasteRecyclingList.value = res.rows
  221. if (store.planDetails.requisitionDepartmentId == store.curDeptDetails.deptId ||
  222. wasteRecyclingList.value.length > 0) {
  223. bottomStatus.value = true;
  224. store.isPreProcess = true;
  225. } else {
  226. bottomStatus.value = false;
  227. store.isPreProcess = false;
  228. }
  229. })
  230. console.log(wasteRecyclingList.value.length)
  231. })
  232. // 页面下拉刷新操作
  233. onPullDownRefresh(() => {
  234. uni.stopPullDownRefresh();
  235. reflush();
  236. })
  237. onShow(() => {
  238. reflush();
  239. })
  240. ;
  241. function reflush() {
  242. init(store.planDetails.id);
  243. }
  244. function handleShowTurnoverApplication(data) {
  245. console.log(data)
  246. //如果这批废了,则不能周转申请
  247. if (data.isWaste == 1) {
  248. uni.showToast({
  249. icon: 'none',
  250. title: '此批已废,不能申请周转',
  251. duration: 2000
  252. })
  253. } else {
  254. let _data = data ?? {}
  255. carrierFinishedCheck(data).then(res => {
  256. if (res.code === 200) {
  257. // 调用子组件中的方法
  258. turnoverApplicationDialog.value.open(_data)
  259. } else {
  260. uni.showToast({
  261. icon: 'none',
  262. title: res.msg
  263. })
  264. }
  265. })
  266. }
  267. }
  268. function handleStartNewBatch() {
  269. store.normalStatus = normalStatus.value;
  270. // console.log(normalStatus.value)
  271. uni.navigateTo({
  272. url: "/pages/addNewBatch/index"
  273. })
  274. }
  275. function init(id) {
  276. uni.showLoading({
  277. title: '加载中'
  278. });
  279. let reqData = {
  280. productionPlanDetailId: id,
  281. deptId: store.curDeptDetails.deptId,
  282. keywords: keywords.value
  283. };
  284. // console.log(normalStatus.value)
  285. getDayWorkList(reqData).then(res => {
  286. console.log(res.data)
  287. if (res.code == 200) {
  288. res.data.forEach(item => {
  289. let quantitySum = 0;
  290. item.dayworkItemList.forEach(info => {
  291. if (info.status < 4 && item.currentProcess.processStepNumber == info
  292. .processStepNumber) {
  293. quantitySum += info.qualifiedNum;
  294. }
  295. });
  296. item.totalQuantity = quantitySum;
  297. });
  298. tempList.value = res.data
  299. // console.log(res)
  300. if (normalStatus.value) {
  301. listData.value = res.data.filter(item => {
  302. return item.isWasteRecycling == 0 && item.isAmend == 0;
  303. });
  304. } else {
  305. listData.value = res.data.filter(item => {
  306. return item.isWasteRecycling == 1 || item.isAmend == 1;
  307. })
  308. }
  309. // 20240614 分批投产数量不按照上到序的完成数量来。
  310. // for (let i = 0; i < listData.value.length; i++) {
  311. // if (listData.value[i].prevProcess) {
  312. // let sum = 0;
  313. // for (let j = 0; j < listData.value[i].dayworkItemList.length; j++) {
  314. // if (listData.value[i].dayworkItemList[j].processId == listData.value[i]
  315. // .prevProcess
  316. // .id && (listData.value[i].dayworkItemList[j].status == 2 || listData
  317. // .value[i]
  318. // .dayworkItemList[j].status == 3)) {
  319. // sum += listData.value[i].dayworkItemList[j].qualifiedNum;
  320. // }
  321. // }
  322. // listData.value[i].processQualifiedNum = sum;
  323. // }
  324. // }
  325. }
  326. uni.hideLoading();
  327. })
  328. }
  329. function handleSearch() {
  330. init(store.planDetails.id);
  331. }
  332. function handleToreportingForWork(item) {
  333. store.dayworkInfo = item
  334. uni.navigateTo({
  335. url: "/pages/reportingForWork/index"
  336. })
  337. }
  338. function handleClickProcessList(item) {
  339. let curProcessAfterList = [];
  340. console.log("工序列表", item)
  341. currentDaywork.value = item
  342. if(item.isWasteRecycling ==1 || item.isAmend ==1){
  343. editStatus.value = true
  344. }else{
  345. editStatus.value = false
  346. }
  347. let nextIndex = 0;
  348. for (let i = 0; i < item.processSequence.length; i++) {
  349. if(item.nextProcess){
  350. if (item.nextProcess.processStepNumber == item.processSequence[i].processStepNumber) {
  351. nextIndex = i;
  352. }
  353. }else{
  354. nextIndex = item.processSequence.length
  355. }
  356. }
  357. for (let i = 0; i < item.processSequence.length; i++) {
  358. if (i >= nextIndex) {
  359. curProcessAfterList.push(item.processSequence[i]);
  360. }
  361. }
  362. if (item.status == 3) {
  363. curProcessAfterList.splice(0, 1)
  364. }
  365. console.log(curProcessAfterList)
  366. curProcessAfte.value = curProcessAfterList;
  367. showRight.value.open();
  368. }
  369. function handleSearchCode() {
  370. // console.log(normalStatus.value)
  371. selectProduction.value.open(normalStatus.value);
  372. }
  373. function switchChange(event) {
  374. console.log(event)
  375. //异常批
  376. if (normalStatus.value) {
  377. listData.value = tempList.value.filter(item => {
  378. return item.isWasteRecycling == 1 || item.isAmend == 1;
  379. });
  380. normalStatus.value = false
  381. } else {
  382. listData.value = tempList.value.filter(item => {
  383. return item.isWasteRecycling == 0 && item.isAmend == 0;
  384. });
  385. normalStatus.value = true
  386. }
  387. }
  388. function handleScanCode() {
  389. // 引入原生插件
  390. const mpaasScanModule = uni.requireNativePlugin("Mpaas-Scan-Module");
  391. if (mpaasScanModule) {
  392. // 调用插件的 mpaasScan 方法
  393. mpaasScanModule.mpaasScan({
  394. // 扫码识别类型,参数可多选,qrCode、barCode,
  395. // 如不设置,默认识别所有扫码类型,可能有些许影响识别效率
  396. scanType: ["qrCode", "barCode"],
  397. // 是否隐藏相册,默认false不隐藏
  398. hideAlbum: false,
  399. },
  400. (ret) => {
  401. console.log(ret);
  402. /* 原有代码,之前二维码中存的信息比较多,用一个JSON格式存储。
  403. let vehicleObj = JSON.parse(ret.resp_result);
  404. if (!vehicleObj.carrierId || vehicleObj.carrierId == "") {
  405. uni.showToast({
  406. icon: "none",
  407. title: "请扫载具码",
  408. duration: 1000
  409. })
  410. return;
  411. }
  412. */
  413. let vehicleObj = {
  414. carrierCode: ret.resp_result
  415. };
  416. if (!vehicleObj.carrierCode || vehicleObj.carrierCode == "") {
  417. uni.showToast({
  418. icon: "none",
  419. title: "请扫载具码",
  420. duration: 1000
  421. })
  422. return;
  423. }
  424. showDaywork({
  425. carrierId: '0', // 不传递箱子id
  426. carrierCode: vehicleObj.carrierCode,
  427. status: 7
  428. }).then(response => {
  429. if (response.code == 200) {
  430. console.log(response)
  431. console.log(response.data[0].productionPlanDetailId)
  432. console.log(store.planDetails.id)
  433. console.log(response.data[0].deptId !== store.curDeptDetails.deptId)
  434. if (response.data[0].deptId !== store.curDeptDetails.deptId) {
  435. uni.showToast({
  436. icon: 'none',
  437. title: '该批次不在当前工段',
  438. duration: 2000
  439. })
  440. return
  441. }
  442. if (response.data[0].productionPlanDetailId == store.planDetails.id) {
  443. console.log(response.data)
  444. lotDialog.value.open(response.data);
  445. } else {
  446. uni.showToast({
  447. icon: 'none',
  448. title: '该批次不在此计划单内',
  449. duration: 2000
  450. })
  451. }
  452. } else {
  453. uni.showToast({
  454. icon: 'none',
  455. title: response.msg,
  456. duration: 2000
  457. })
  458. }
  459. })
  460. }
  461. );
  462. } else {
  463. // 测试时用
  464. showDaywork({
  465. carrierId: '1780467398971187210',
  466. carrierCode: '',
  467. status: 7
  468. }).then(response => {
  469. if (response.code == 200) {
  470. console.log(response)
  471. console.log(response.data[0].productionPlanDetailId)
  472. console.log(store.planDetails.id)
  473. console.log(response.data[0].deptId !== store.curDeptDetails.deptId)
  474. if (response.data[0].deptId !== store.curDeptDetails.deptId) {
  475. uni.showToast({
  476. icon: 'none',
  477. title: '该批次已转至其他工段',
  478. duration: 2000
  479. })
  480. return
  481. }
  482. if (response.data[0].productionPlanDetailId == store.planDetails.id) {
  483. console.log(response.data)
  484. lotDialog.value.open(response.data);
  485. } else {
  486. uni.showToast({
  487. icon: 'none',
  488. title: '该批次不在此计划单内',
  489. duration: 2000
  490. })
  491. }
  492. } else {
  493. uni.showToast({
  494. icon: 'none',
  495. title: response.msg,
  496. duration: 2000
  497. })
  498. }
  499. })
  500. }
  501. }
  502. function handleAddDaywork(data) {
  503. console.log(data)
  504. let reqParam = [];
  505. for (var i = 0; i < data.length; i++) {
  506. reqParam.push(data[i].daywork)
  507. }
  508. console.log(data)
  509. showDayworkSave(data).then(res => {
  510. console.log(res)
  511. init(store.planDetails.id);
  512. })
  513. }
  514. function handleDoIt(data) {
  515. handleAddDaywork(data);
  516. }
  517. function handleOpenDrawing(){
  518. console.log(currentDaywork.value,"444")
  519. var filteredProcess = currentDaywork.value.processSequence.filter(item => item.processStepNumber == currentDaywork.value.currentProcess.processStepNumber);
  520. // 检查 filteredProcess 是否有元素,并选择第一个元素
  521. if (filteredProcess.length > 0) {
  522. var firstMatch = filteredProcess[0]; // 获取第一个匹配的对象
  523. // 对 technologicalProcessDetailId 进行URL编码
  524. var encodedId = encodeURIComponent(currentDaywork.value.productId);
  525. var enTechnologicalProcessId = encodeURIComponent(currentDaywork.value.technologicalProcessId);
  526. var enprocessCode = encodeURIComponent(firstMatch.processCode);
  527. var encodeCode = encodeURIComponent(currentDaywork.value.lotCode);
  528. var enProcessAlias = encodeURIComponent(firstMatch.processAlias);
  529. // 构建查询参数字符串
  530. var queryParam = `param1=${encodedId}&param2=${encodeCode}&param3=${enprocessCode}&param4=${enTechnologicalProcessId}&param5=${enProcessAlias}`;
  531. // 使用模板字符串构建完整的URL
  532. var navigateUrl = `/pages/drawingMenu/index?${queryParam}`;
  533. // 导航到指定页面
  534. uni.navigateTo({
  535. url: navigateUrl
  536. });
  537. } else {
  538. console.log('No process matched the current process step number.');
  539. }
  540. }
  541. function handleDoTurnoverAfter() {
  542. reflush();
  543. }
  544. function handleCancelTurnover(data) {
  545. isMaskShow.value = true; // 显示遮罩层
  546. uni.showLoading({
  547. title: '加载中'
  548. });
  549. turnoverDelete(data).then(res => {
  550. isMaskShow.value = false
  551. if (res.code == 200) {
  552. uni.showToast({
  553. icon: "success",
  554. title: "取消成功",
  555. duration: 2000
  556. })
  557. isLoding.value = false;
  558. init(store.planDetails.id);
  559. } else {
  560. uni.showToast({
  561. icon: "none",
  562. title: "取消失败",
  563. duration: 2000
  564. })
  565. isLoding.value = false;
  566. }
  567. })
  568. }
  569. </script>
  570. <style lang="scss">
  571. $nav-height: 60rpx;
  572. /* 遮罩层样式 */
  573. .mask {
  574. position: fixed;
  575. /* 固定定位,覆盖整个屏幕 */
  576. top: 0;
  577. left: 0;
  578. right: 0;
  579. bottom: 0;
  580. background-color: rgba(0, 0, 0, 0.3);
  581. /* 黑色背景,透明度30% */
  582. display: flex;
  583. justify-content: center;
  584. /* 水平居中 */
  585. align-items: center;
  586. /* 垂直居中 */
  587. z-index: 1000;
  588. /* 确保遮罩层在其他元素之上 */
  589. }
  590. .box-bg {
  591. width: 94%;
  592. background-color: #F5F5F5;
  593. padding: 5rpx 16rpx;
  594. justify-content: space-around;
  595. align-items: center;
  596. margin: 24rpx auto 0;
  597. .input-view {
  598. width: 100%;
  599. flex: 4;
  600. background-color: #f8f8f8;
  601. height: $nav-height;
  602. border: 1rpx solid #999;
  603. border-radius: 15rpx;
  604. padding: 0 15rpx;
  605. flex-wrap: nowrap;
  606. margin: 0 10rpx 0;
  607. line-height: $nav-height;
  608. .input-uni-icon {
  609. line-height: $nav-height;
  610. }
  611. .nav-bar-input {
  612. width: 80%;
  613. height: $nav-height;
  614. line-height: $nav-height;
  615. padding: 0 5rpx;
  616. background-color: #f8f8f8;
  617. }
  618. }
  619. .search {
  620. width: 20%;
  621. text-align: center;
  622. color: #808080;
  623. }
  624. }
  625. .list-title {
  626. width: 100%;
  627. margin-top: 16rpx;
  628. height: 64rpx;
  629. line-height: 64rpx;
  630. align-items: center;
  631. margin-left: 32rpx;
  632. .label {
  633. font-size: 32rpx;
  634. margin-right: 24rpx;
  635. }
  636. .icon-gear {
  637. font-size: 56rpx;
  638. }
  639. }
  640. .switch {
  641. margin-top: -8rpx;
  642. transform: scale(0.7);
  643. }
  644. .scroll-container {
  645. width: 92%;
  646. margin: 24rpx auto 0 auto;
  647. height: calc(90% - 100rpx);
  648. overflow: auto;
  649. }
  650. .list-item {
  651. background-color: #fff;
  652. position: relative;
  653. padding: 16rpx;
  654. padding-bottom: 24rpx;
  655. margin-bottom: 24rpx;
  656. border-radius: 24rpx;
  657. .title-container {
  658. margin-top: 8rpx;
  659. margin-bottom: 16rpx;
  660. .title {
  661. height: 48rpx;
  662. align-items: center;
  663. .label {
  664. font-size: 32rpx;
  665. font-weight: bold;
  666. &.code {
  667. margin-left: 8rpx;
  668. }
  669. }
  670. }
  671. .tag {
  672. border: 1px solid #1CE5B0;
  673. background-color: #F6FFFD;
  674. padding: 8rpx;
  675. border-radius: 8rpx;
  676. .label {
  677. color: #1CE5B0;
  678. font-size: 24rpx;
  679. }
  680. &.finished {
  681. border: 1px solid #BBBBBB;
  682. background-color: #F5F5F5;
  683. .label {
  684. color: #BBBBBB;
  685. }
  686. }
  687. &.turnover {
  688. border: 1px solid #FF7901;
  689. background-color: #F6FFFD;
  690. .label {
  691. color: #FF7901;
  692. }
  693. }
  694. }
  695. }
  696. .item-info {
  697. margin-bottom: 8rpx;
  698. .label {
  699. font-size: 28rpx;
  700. width: 220rpx;
  701. color: #808080;
  702. &.right {
  703. flex: 1;
  704. color: #000000;
  705. }
  706. }
  707. }
  708. .status-btn {
  709. justify-content: flex-end;
  710. align-items: center;
  711. .turnover-tag {
  712. padding-right: 12rpx;
  713. padding-left: 12rpx;
  714. border-radius: 8rpx;
  715. border: 1rpx solid #FF7901;
  716. background-color: #FF7901;
  717. font-size: 28rpx;
  718. color: #FFFFFF;
  719. }
  720. .reporting-tag {
  721. padding-right: 12rpx;
  722. padding-left: 12rpx;
  723. border-radius: 8rpx;
  724. margin-left: 16rpx;
  725. border: 1rpx solid #1684fc;
  726. background-color: #1684fc;
  727. font-size: 28rpx;
  728. color: #FFFFFF;
  729. }
  730. }
  731. }
  732. .bottom {
  733. height: 10%;
  734. position: fixed;
  735. right: 0;
  736. bottom: 0;
  737. left: 0;
  738. height: 100rpx;
  739. border-top: 1px solid #999999;
  740. padding: 16rpx 32rpx;
  741. align-items: center;
  742. background-color: #fff;
  743. justify-content: space-evenly;
  744. .start-batch-btn {
  745. flex: 1;
  746. height: 80rpx;
  747. line-height: 80rpx;
  748. border-radius: 8rpx;
  749. color: #FFFFFF;
  750. font-size: 28rpx;
  751. }
  752. .view-end-btn {
  753. flex: 1;
  754. height: 80rpx;
  755. line-height: 80rpx;
  756. border-radius: 8rpx;
  757. color: #FFFFFF;
  758. font-size: 28rpx;
  759. }
  760. }
  761. </style>