fqcList.vue 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519
  1. <template>
  2. <gui-page :custom-header="true" :header-class="['gui-theme-background-color']">
  3. <template #gHeader>
  4. <view style="height:44px;" class="gui-flex gui-nowrap gui-rows gui-align-items-center">
  5. <!-- 使用组件实现返回按钮及返回首页按钮 -->
  6. <text
  7. style="font-size:44rpx;"
  8. class="gui-header-leader-btns gui-color-white font-icons"
  9. @tap="goHome"
  10. >&#xe6c5;</text>
  11. <!-- 导航文本此处也可以是其他自定义内容 -->
  12. <text
  13. class="gui-h4 gui-blod gui-flex1 gui-text-center gui-ellipsis gui-color-white gui-primary-text"
  14. >生产执行</text>
  15. <!-- 此处加一个右侧展位元素与左侧同宽,实现标题居中 -->
  16. <!-- 实际宽度请根据自己情况设置 -->
  17. <view style="width:40px;" />
  18. <!-- 如果右侧有其他内容可以利用条件编译和定位来实现-->
  19. </view>
  20. </template>
  21. <template #gBody>
  22. <view class="list-content">
  23. <view class="search">
  24. <view class="search">
  25. <view class="search-card">
  26. <text style="font-size: 12px;">物料批次</text>
  27. <view class="custom-select" style="display: flex; align-items: center;">
  28. <uni-easyinput
  29. v-model="queryParams.materialLots"
  30. focus
  31. type="text"
  32. placeholder="请输入物料批次"
  33. style="flex: 1;"
  34. />
  35. <text class="scan-icon font-icons" @tap="scanCode" style="margin-left: 8px; font-size: 24px; color: #007aff;">
  36. &#xe6b7;
  37. </text>
  38. </view>
  39. </view>
  40. <view class="search-card">
  41. <button type="primary" size="mini" @click="search">搜索</button>
  42. </view>
  43. </view>
  44. <!-- 搜索框格式为2×2 的 Grid -->
  45. <!-- <view class="search-card">
  46. <text style="font-size: 12px;">生产订单</text>
  47. <view class="custom-select">
  48. <uni-easyinput
  49. v-model="queryParams.erpOrderNo"
  50. focus
  51. type="text"
  52. placeholder="请输入订单编号"
  53. />
  54. </view>
  55. </view> -->
  56. <!-- <view class="search-card">
  57. <text>产品编号</text>
  58. <view class="custom-select">
  59. <uni-easyinput v-model="queryParams.materialNo" type="text" placeholder="请输入产品编号" />
  60. </view>
  61. </view> -->
  62. <!-- <view class="search-card">
  63. <text>创建时间</text>
  64. <view class="custom-select">
  65. <uni-datetime-picker
  66. v-model="queryParams.createTime"
  67. type="daterange"
  68. @change="handlePickerChange"
  69. />
  70. </view>
  71. </view> -->
  72. <!-- <view class="search-card">
  73. <text>产品名称</text>
  74. <view class="custom-select">
  75. <uni-easyinput v-model="queryParams.materialName" type="text" placeholder="请输入产品名称" />
  76. </view>
  77. </view> -->
  78. <!-- <view class="search-card">
  79. <view class="custom-select">
  80. <button type="primary" size="mini" @click="search">搜索</button>
  81. </view>
  82. </view> -->
  83. </view>
  84. <view v-if="cardList?.length > 0" class="list-panel">
  85. <view
  86. v-for="item in cardList"
  87. :key="item.id"
  88. class="panel"
  89. @click="handleToScanMaterials(item)"
  90. >
  91. <view class="panel-row">
  92. <text>{{ item.materialLots }}</text>
  93. <text class="text-2 font-icons">开始执行&#xe66b;</text>
  94. </view>
  95. <!-- <view class="panel-row">
  96. <text>物料批次</text>
  97. <text>{{ item.materialLots }}</text>
  98. </view> -->
  99. <view class="panel-row">
  100. <text>采购订单</text>
  101. <text>{{ item.purchaseOrderNo }}</text>
  102. </view>
  103. <view class="panel-row">
  104. <text>物料名称</text>
  105. <text>{{ item.materialName }}</text>
  106. </view>
  107. <view class="panel-row">
  108. <text>物料编码</text>
  109. <text>{{ item.materialNo }}</text>
  110. </view>
  111. <view class="panel-row">
  112. <text>数量</text>
  113. <text>{{ item.receiptQty }}</text>
  114. </view>
  115. </view>
  116. </view>
  117. <view v-else>
  118. <view class="bg-image">
  119. <image src="@/static/empty.png" mode="heightFix" />
  120. <text>这里什么都没有...</text>
  121. </view>
  122. </view>
  123. <!-- 已注释,不再使用的popup组件 -->
  124. <!-- <uni-popup ref="popup" background-color="#fff">
  125. <view class="popup-process-content">
  126. <view class="list-title" style="margin-bottom: 8px;">
  127. <span
  128. class="font-icons"
  129. style="font-size: 20px;color: #00a0e9;width: 40px;text-align: center;"
  130. >&#xe6a3;</span>
  131. <span>FQC检验报告列表</span>
  132. </view>
  133. <view>
  134. <view style="display: flex;align-items: center;margin: 45px 6px 0 6px;">
  135. <text style="font-size: 14px;">设置检验时间</text>
  136. <picker
  137. mode="date"
  138. style="width: 20%;min-width: 135px;height: 40px;display: flex;justify-content: center;align-items: center;"
  139. :value="currentRow.oqcDate"
  140. @change="bindTimeChange($event)"
  141. >
  142. <view
  143. class="uni-input"
  144. style="
  145. width: 125px;
  146. height: 30px;
  147. display: flex;
  148. align-items: center;
  149. justify-content: center;
  150. border: 1px solid #6a6a6a;
  151. border-radius: 6px;
  152. font-size: 14px;
  153. "
  154. >
  155. {{ currentRow.oqcDate }}
  156. </view>
  157. </picker>
  158. </view>
  159. <view class="grid-box">
  160. <view
  161. v-for="(item, index) in dictDataList"
  162. :key="index"
  163. class="box"
  164. style="background-color: rgb(44, 183, 85);"
  165. @click="handleAddOQC(item.value)"
  166. >
  167. <text>新增{{ item.label }}检验</text>
  168. </view>
  169. </view>
  170. <view class="grid-box">
  171. <view
  172. v-for="(item, index) in oqcList"
  173. :key="index"
  174. class="box"
  175. @click="handleClickOQCName(item)"
  176. >
  177. <text>{{ item.ipqcDate }}</text>
  178. <text>{{ item.classFlagNmae }}</text>
  179. </view>
  180. </view>
  181. </view>
  182. </view>
  183. </uni-popup> -->
  184. </view>
  185. </template>
  186. </gui-page>
  187. </template>
  188. <script>
  189. import {
  190. onReachBottom
  191. } from '@dcloudio/uni-app'
  192. import {
  193. ref,
  194. defineComponent,
  195. computed,
  196. onMounted
  197. } from 'vue'
  198. import { formatDate } from '@/unit/default.js'
  199. export default defineComponent({
  200. setup() {
  201. // const popup = ref() // 已注释,不再使用
  202. // const oqcList = ref([]) // 已注释,不再使用
  203. // const currentRow = ref() // 已注释,不再使用
  204. // const dictDataList = ref([]) // 已注释,不再使用
  205. const queryParams = ref({
  206. pageSize: 10,
  207. pageNo: 1,
  208. auditStatus: -1,
  209. erpOrderNo: '',
  210. materialNo: '',
  211. materialName: '',
  212. materialLots: '',
  213. createTime: []
  214. })
  215. const cardList = ref([])
  216. // const computedCreateTime = computed(() => {
  217. // return item => {
  218. // if (![NaN, null, undefined, ''].includes(item)) {
  219. // return formatDate(item)
  220. // }
  221. // return ''
  222. // }
  223. // })
  224. onMounted(() => {
  225. search()
  226. // 获取班别字典数据(已注释,不再使用)
  227. /* uni.$reqGet('getDictDataPage', {
  228. dictType: 'class_flag',
  229. pageNo: 1,
  230. pageSize: 100
  231. })
  232. .then(({
  233. code,
  234. data,
  235. msg
  236. }) => {
  237. dictDataList.value = data?.list ?? []
  238. })
  239. */
  240. })
  241. const search = function() {
  242. const params = {
  243. pageNo: queryParams.value.pageNo,
  244. pageSize: queryParams.value.pageSize,
  245. auditStatus: queryParams.value.auditStatus,
  246. materialLots: queryParams.value.materialLots,
  247. // erpOrderNo: queryParams.value.erpOrderNo,
  248. // materialNo: queryParams.value.materialNo,
  249. // materialName: queryParams.value.materialName
  250. // 'createTime[0]': queryParams.value.createTime[0] ?? "",
  251. // 'createTime[1]': queryParams.value.createTime[1] ?? "",
  252. }
  253. uni.$reqGet('getProductionWorkOrderDetailPage', params)
  254. .then(({
  255. data,
  256. msg
  257. }) => {
  258. cardList.value = data?.list ?? []
  259. })
  260. }
  261. const goHome = function() {
  262. uni.$goHome()
  263. }
  264. const handleToScanMaterials = function(item) {
  265. // 先打开FQC质检页面
  266. /* if (popup.value?.showPopup === false) {
  267. popup.value.open('bottom')
  268. }
  269. currentRow.value = item
  270. uni.$reqGet('getInComingReceiptInspectionList', {
  271. detailErpId: item?.detailErpId
  272. })
  273. .then(({
  274. code,
  275. data,
  276. msg
  277. }) => {
  278. oqcList.value = data ?? []
  279. })
  280. */
  281. // 存储数据,使用fqcCheckout页面需要的键名
  282. uni.setStorageSync('masterId', JSON.stringify({
  283. id: item?.id
  284. }))
  285. // 跳转到fqcCheckout页面
  286. console.log('跳转参数:', JSON.stringify(item));
  287. uni.navigateTo({
  288. url: `/pages/workbranch/production/FQC/fqcCheckout`
  289. })
  290. }
  291. // 扫码获取物料批次
  292. const scanCode = function() {
  293. uni.scanCode({
  294. success: function(res) {
  295. // 将扫码结果填入物料批次输入框
  296. queryParams.value.materialLots = res.result
  297. // 自动执行搜索
  298. search()
  299. },
  300. fail: function(err) {
  301. console.log('扫码失败', err)
  302. uni.showToast({
  303. title: '扫码失败',
  304. icon: 'none'
  305. })
  306. }
  307. })
  308. }
  309. // 绑定日期时间事件(已注释,不再使用)
  310. /* const bindTimeChange = function(e) {
  311. currentRow.value.oqcDate = e.detail.value
  312. }
  313. const handleAddOQC = function(state) {
  314. // 调接口新增
  315. uni.$reqPost('createFQC', {
  316. detailErpId: currentRow.value?.detailErpId,
  317. processNo: 'FQC',
  318. materialNo: currentRow.value?.materialNo,
  319. classFlag: state,
  320. oqcDate: currentRow.value?.oqcDate
  321. })
  322. .then(({
  323. code,
  324. data,
  325. msg
  326. }) => {
  327. if (code === 0) {
  328. uni.navigateTo({
  329. url: `/pages/workbranch/production/FQC/fqcCheckout?params=${JSON.stringify({ id: data })}`
  330. })
  331. } else {
  332. uni.showToast({
  333. title: msg,
  334. duration: 2000,
  335. icon: 'none'
  336. })
  337. }
  338. })
  339. }
  340. // FQC检验列表选择事件(已注释,不再使用)
  341. const handleClickOQCName = function(params) {
  342. uni.navigateTo({
  343. url: `/pages/workbranch/production/FQC/fqcCheckout?params=${JSON.stringify(params)}`
  344. })
  345. } */
  346. // uniapp移动端触底事件
  347. onReachBottom(() => {
  348. queryParams.value.pageNo += 1
  349. uni.$reqGet('getProductionWorkOrderDetailPage', queryParams.value)
  350. .then(({
  351. data
  352. }) => {
  353. Array.prototype.push.call(cardList.value, ...data?.list ?? [])
  354. })
  355. })
  356. return {
  357. // popup, // 已注释,不再使用
  358. goHome,
  359. search,
  360. cardList,
  361. // oqcList, // 已注释,不再使用
  362. // currentRow, // 已注释,不再使用
  363. // dictDataList, // 已注释,不再使用
  364. // handleAddOQC, // 已注释,不再使用
  365. queryParams,
  366. // bindTimeChange, // 已注释,不再使用
  367. // computedCreateTime, // 已注释,不再使用
  368. // handleClickOQCName, // 已注释,不再使用
  369. handleToScanMaterials,
  370. scanCode
  371. }
  372. }
  373. })
  374. </script>
  375. <style lang="scss" scoped>
  376. .gui-header-leader-btns {
  377. color: black;
  378. font-size: 24px !important;
  379. margin-left: 24rpx;
  380. }
  381. .list-content {
  382. margin-top: 80px;
  383. background-color: #edeeee;
  384. }
  385. .search {
  386. margin: 12px;
  387. padding: 12px;
  388. background: #fff;
  389. border-radius: 6px;
  390. display: flex;
  391. flex-direction: column;
  392. gap: 12px; // 两行间距
  393. }
  394. .search-card {
  395. display: flex;
  396. align-items: center;
  397. gap: 8px; // 文字与输入框/按钮间距
  398. }
  399. /* 让输入框占满剩余宽度 */
  400. .custom-select {
  401. flex: 1;
  402. }
  403. /* 搜索框2*2布局
  404. .search {
  405. height: 100px;
  406. width: calc(100% - 48px);
  407. margin: 12px;
  408. padding: 0 12px;
  409. display: grid;
  410. grid-template-columns: 1fr 1fr;
  411. grid-template-rows: 1fr 1fr;
  412. align-items: center;
  413. border-radius: 6px;
  414. background-color: white;
  415. .search-card {
  416. width: 100%;
  417. display: grid;
  418. grid-template-rows: 1fr;
  419. grid-template-columns: 3fr 7fr;
  420. align-items: center;
  421. text {
  422. display: flex;
  423. justify-content: center;
  424. }
  425. }
  426. }
  427. */
  428. /* 已注释,不再使用的popup相关样式 */
  429. /* .popup-process-content {
  430. width: 100vw;
  431. height: 85vh;
  432. overflow-y: scroll;
  433. .list-title {
  434. position: fixed;
  435. top: 0;
  436. left: 0;
  437. z-index: 99999;
  438. width: 100%;
  439. display: flex;
  440. align-items: center;
  441. height: 45px;
  442. line-height: 45px;
  443. font-size: 16px;
  444. font-weight: bold;
  445. border-top-left-radius: 16px;
  446. border-top-right-radius: 16px;
  447. border-bottom: 1px solid #d4d4d4;
  448. background-color: white;
  449. .block {
  450. width: 6px;
  451. height: 60%;
  452. margin: 0 4px;
  453. background-color: rgb(0, 160, 233);
  454. }
  455. }
  456. .grid-box {
  457. display: grid;
  458. grid-template-columns: 1fr 1fr 1fr;
  459. .box {
  460. position: relative;
  461. height: 40px;
  462. padding: 10px 6px;
  463. border: 1px solid rgb(250, 250, 251);
  464. box-sizing: border-box;
  465. margin: 12px;
  466. display: flex;
  467. justify-content: center;
  468. align-items: center;
  469. font-size: 14px;
  470. font-weight: bold;
  471. border-radius: 4px;
  472. color: white;
  473. box-shadow: 0 3px 6px 0 rgba(121, 118, 118, 0.34);
  474. background-color: rgb(0, 160, 233);
  475. }
  476. .box::before {
  477. content: '';
  478. position: absolute;
  479. top: 20px;
  480. left: 0;
  481. bottom: 0;
  482. transform: translate(-50%, -50%);
  483. width: 12px;
  484. height: 12px;
  485. border-radius: 50%;
  486. z-index: 1;
  487. background-color: #ffffff;
  488. }
  489. }
  490. .grid-box:nth-of-type(1) {
  491. margin-top: 45px;
  492. }
  493. } */
  494. </style>