index.vue 22 KB

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