| | |
| | | <template> |
| | | <view> |
| | | <u-sticky> |
| | | <view style="background-color: #ffffff;"> |
| | | <uni-search-bar @confirm="search" v-model="searchValue"></uni-search-bar> |
| | | </view> |
| | | </u-sticky> |
| | | <uni-list :border="true"> |
| | | <uni-list-item direction="column" clickable @click="groupClick(item.orderNo)" link |
| | | :to="page+item.orderNo" v-for="item in allReceivingOrders" :key="item.orderNo"> |
| | | <template v-slot:body> |
| | | <uni-group margin-top="20"> |
| | | <view style="line-height: 17px;color: #596671;font-size: 14px;text-align: center;display: flex;justify-content: space-between;"> |
| | | å
¥åºåå· {{item.orderNo}} |
| | | </view> |
| | | <view style="margin-top: 10rpx;line-height: 17px;color: #596671;font-size: 14px;text-align: center;display: flex;justify-content: space-between;"> |
| | | å建人å {{item.creater}} |
| | | </view> |
| | | <view style="margin-top: 10rpx;line-height: 17px;color: #596671;font-size: 14px;text-align: center;display: flex;justify-content: space-between;"> |
| | | åå»ºæ¥æ {{item.createDate}} |
| | | </view> |
| | | <view |
| | | style="margin-top: 10rpx;display: flex;align-items: center; "> |
| | | <view style="text-align: center;line-height: 40rpx;border-radius: 8rpx; width: 238rpx;height: 40rpx;font-size: 22rpx;background-color:rgba(22,127,247,0.18);color: #1F63FF;"> |
| | | 订åç¶æ {{item.InboundOrderStatus}} |
| | | </view> |
| | | <view style="text-align: center;line-height: 40rpx;border-radius: 8rpx; width: 158rpx;height: 40rpx;font-size: 22rpx;color: #F56C6C;"> |
| | | æ»é {{item.SumQty}} |
| | | </view> |
| | | <view style="text-align: center;line-height: 40rpx;border-radius: 8rpx; width: 158rpx;height: 40rpx;font-size: 22rpx;color: #F56C6C;"> |
| | | å·²å
¥ {{item.OverQty}} |
| | | </view> |
| | | </view> |
| | | </uni-group> |
| | | </template> |
| | | </uni-list-item> |
| | | <view> |
| | | <u-sticky> |
| | | <view style="background-color: #ffffff;"> |
| | | <uni-search-bar @confirm="search" v-model="searchValue" @input="handleSearchInput"></uni-search-bar> |
| | | </view> |
| | | </u-sticky> |
| | | |
| | | </uni-list> |
| | | <uni-load-more :status="status" v-if="loadVisible"></uni-load-more> |
| | | <!-- ç§»é¤äºå
鍿»å¨å®¹å¨ï¼è®©é¡µé¢èªç¶æ»å¨ï¼æææ°æ®é½ä¼æ¾ç¤º --> |
| | | <uni-list :border="true"> |
| | | <uni-list-item |
| | | direction="column" |
| | | v-for="item in allReceivingOrders" |
| | | :key="item.orderNo" |
| | | clickable |
| | | @click="groupClick(item.orderNo)" |
| | | link |
| | | :to="page + item.orderNo" |
| | | > |
| | | <template v-slot:body> |
| | | <uni-group margin-top="20"> |
| | | <view style="line-height: 17px;color: #596671;font-size: 14px;text-align: center;display: flex;justify-content: space-between;"> |
| | | å
¥åºåå·ï¼ {{ item.orderNo }} |
| | | </view> |
| | | <view style="margin-top: 10rpx;line-height: 17px;color: #596671;font-size: 14px;text-align: center;display: flex;justify-content: space-between;"> |
| | | å建人åï¼ {{ item.creater }} |
| | | </view> |
| | | <view style="margin-top: 10rpx;line-height: 17px;color: #596671;font-size: 14px;text-align: center;display: flex;justify-content: space-between;"> |
| | | åå»ºæ¥æï¼ {{ item.createDate }} |
| | | </view> |
| | | <view style="margin-top: 10rpx;line-height: 17px;color: #596671;font-size: 14px;text-align: center;display: flex;justify-content: left;"> |
| | | ç©ææå·ï¼ |
| | | <view class="container"> |
| | | <view v-for="(materielCode, index) in getUniqueMaterielCodes(item.details)" :key="index"> |
| | | {{ materielCode }} |
| | | <u-line color="blue" v-if="index < getUniqueMaterielCodes(item.details).length - 1" /> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view style="margin-top: 10rpx;display: flex;align-items: center;"> |
| | | <view style="text-align: center;line-height: 40rpx;border-radius: 8rpx; width: 238rpx;height: 40rpx;font-size: 22rpx;background-color:rgba(22,127,247,0.18);color: #1F63FF;"> |
| | | 订åç¶æï¼ {{ item.InboundOrderStatus }} |
| | | </view> |
| | | <view style="text-align: center;line-height: 40rpx;border-radius: 8rpx; width: 158rpx;height: 40rpx;font-size: 22rpx;color: #F56C6C;"> |
| | | æ»éï¼ {{ item.SumQty }} |
| | | </view> |
| | | <view style="text-align: center;line-height: 40rpx;border-radius: 8rpx; width: 158rpx;height: 40rpx;font-size: 22rpx;color: #F56C6C;"> |
| | | å·²å
¥ï¼ {{ item.OverQty }} |
| | | </view> |
| | | </view> |
| | | </uni-group> |
| | | </template> |
| | | </uni-list-item> |
| | | </uni-list> |
| | | |
| | | <u-back-top :scroll-top="scrollTop" top="400"></u-back-top> |
| | | </view> |
| | | <!-- ç§»é¤å è½½æ´å¤ç»ä»¶ï¼å 为ä¸åé¡µäº --> |
| | | <!-- <uni-load-more :status="status" v-if="loadVisible && allReceivingOrders.length > 0"></uni-load-more> --> |
| | | |
| | | <!-- ç©ºæ°æ®æç¤º --> |
| | | <view v-if="allReceivingOrders.length === 0 && !isLoading" style="text-align: center; padding: 100rpx 0; color: #999;"> |
| | | ææ å
¥åºè®¢åæ°æ® |
| | | </view> |
| | | |
| | | <!-- è¿å顶鍿é®ï¼å¯éï¼ --> |
| | | <u-back-top :scroll-top="scrollTop" top="400"></u-back-top> |
| | | </view> |
| | | </template> |
| | | |
| | | <script> |
| | | import { InboundOrderStatus } from '../../common/config.js' |
| | | export default { |
| | | data() { |
| | | return { |
| | | page: "/pages/stash/raworderboxing?", |
| | | loadVisible: false, |
| | | searchValue: "", |
| | | status: "more", |
| | | allReceivingOrders: [], |
| | | pageNo: 1, |
| | | scrollTop: 0, |
| | | warehouseId: "", |
| | | isLoaded:false |
| | | } |
| | | }, |
| | | onLoad(res) { |
| | | this.warehouseId = res.warehouseId; |
| | | this.page = this.page + "warehouseId=" + this.warehouseId + "&orderNo="; |
| | | this.getData(); |
| | | }, |
| | | onReachBottom() { |
| | | this.pageNo += 1; |
| | | this.getData(); |
| | | this.isLoaded=true; |
| | | }, |
| | | onShow() { |
| | | if (this.isLoaded) { |
| | | // ä»å
¶ä»é¡µé¢è¿åæ¶å·æ° |
| | | this.getData(); |
| | | } |
| | | }, |
| | | onPageScroll(e) { |
| | | this.scrollTop = e.scrollTop; |
| | | }, |
| | | methods: { |
| | | search(res) { |
| | | this.getData(); |
| | | }, |
| | | groupClick() { |
| | | import { InboundOrderStatus } from '../../common/config.js'; |
| | | |
| | | }, |
| | | getData() { |
| | | var postData = { |
| | | MainData: { |
| | | warehouseId: this.warehouseId, |
| | | orderNo: this.searchValue, |
| | | pageNo: this.pageNo |
| | | }, |
| | | } |
| | | this.$u.post('/api/InboundOrder/GetInboundOrders', postData).then((res) => { |
| | | if (res.status) { |
| | | if (res.data.length > 0) { |
| | | if (this.searchValue == '') { |
| | | this.allReceivingOrders = res.data.map(i => ({ |
| | | ...i, |
| | | InboundOrderStatus: InboundOrderStatus.find(item => item.value == i |
| | | .orderStatus).label, |
| | | SumQty: i.details.map(item => item.orderQuantity).reduce((prev, next) => prev + next, 0), |
| | | OverQty: i.details.map(item => item.overInQuantity).reduce((prev, next) => prev + next, 0) |
| | | })); |
| | | // this.allReceivingOrders = res.data; |
| | | if (this.allReceivingOrders.length > 3) { |
| | | this.loadVisible = true; |
| | | } else { |
| | | this.loadVisible = false; |
| | | } |
| | | } else { |
| | | this.allReceivingOrders = res.data.map(i => ({ |
| | | ...i, |
| | | InboundOrderStatus: InboundOrderStatus.find(item => item.value == i |
| | | .orderStatus).label, |
| | | SumQty: i.details.map(item => item.orderQuantity).reduce((prev, next) => prev + next, 0), |
| | | OverQty: i.details.map(item => item.overInQuantity).reduce((prev, next) => prev + next, 0) |
| | | })); |
| | | if (this.allReceivingOrders.length > 3) { |
| | | this.loadVisible = true; |
| | | } else { |
| | | this.loadVisible = false; |
| | | } |
| | | } |
| | | } else { |
| | | this.status = 'noMore'; |
| | | //this.allReceivingOrders = []; |
| | | this.loadVisible = true; |
| | | } |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | export default { |
| | | data() { |
| | | return { |
| | | page: '/pages/stash/raworderboxing?', |
| | | searchValue: '', |
| | | allReceivingOrders: [], // æ¾ç¤ºå¨åç«¯çæ°æ®ï¼å¯è½è¢«æç´¢è¿æ»¤ï¼ |
| | | originalOrders: [], // å卿æåå§æ°æ® |
| | | scrollTop: 0, |
| | | warehouseId: '', |
| | | isLoaded: false, // æ¯å¦ä»è¯¦æ
页è¿å |
| | | isLoading: false, // 鲿¢éå¤è¯·æ± |
| | | }; |
| | | }, |
| | | onLoad(res) { |
| | | this.warehouseId = res.warehouseId; |
| | | this.page = this.page + 'warehouseId=' + this.warehouseId + '&orderNo='; |
| | | // ç´æ¥å è½½å
¨é¨æ°æ®ï¼ä¸åé¡µï¼ |
| | | this.getAllData(); |
| | | }, |
| | | onShow() { |
| | | // ä»è¯¦æ
页è¿åæ¶ï¼å¦ææ°æ®å·²è¢«ä¿®æ¹ï¼å¯ä»¥éæ°å è½½ |
| | | if (this.isLoaded) { |
| | | this.getAllData(); |
| | | this.isLoaded = false; |
| | | } |
| | | }, |
| | | onPageScroll(e) { |
| | | this.scrollTop = e.scrollTop; |
| | | }, |
| | | methods: { |
| | | // ç©ææå·å»é |
| | | getUniqueMaterielCodes(details) { |
| | | if (!details || !Array.isArray(details)) return []; |
| | | return [...new Set(details.map(item => item.materielCode))]; |
| | | }, |
| | | |
| | | // æç´¢è¾å
¥å¤çï¼å端çéï¼ |
| | | handleSearchInput() { |
| | | if (this.searchValue === '') { |
| | | this.allReceivingOrders = [...this.originalOrders]; |
| | | return; |
| | | } |
| | | const searchText = this.searchValue.toLowerCase().trim(); |
| | | this.allReceivingOrders = this.originalOrders.filter(item => { |
| | | if (item.orderNo && item.orderNo.toLowerCase().includes(searchText)) { |
| | | return true; |
| | | } |
| | | if (item.details && item.details.length > 0) { |
| | | return item.details.some(detail => |
| | | detail.materielCode && detail.materielCode.toLowerCase().includes(searchText) |
| | | ); |
| | | } |
| | | return false; |
| | | }); |
| | | }, |
| | | |
| | | search() { |
| | | this.handleSearchInput(); |
| | | }, |
| | | |
| | | groupClick() { |
| | | this.isLoaded = true; |
| | | }, |
| | | |
| | | // 䏿¬¡æ§è·åæææ°æ®ï¼ä¸åé¡µï¼ |
| | | getAllData() { |
| | | if (this.isLoading) return; |
| | | this.isLoading = true; |
| | | |
| | | // 设置ä¸ä¸ªè¶³å¤å¤§ç pageSize æ¥è·åæææ°æ®ï¼æ ¹æ®æ¥å£æå¤§éå¶è°æ´ï¼ |
| | | const postData = { |
| | | MainData: { |
| | | warehouseId: this.warehouseId, |
| | | orderNo: '', |
| | | pageNo: 1, |
| | | pageSize: 9999, // å设æ¥å£æ¯æè¿ä¹å¤§çå页 |
| | | }, |
| | | }; |
| | | |
| | | this.$u |
| | | .post('/api/InboundOrder/GetInboundOrders', postData) |
| | | .then(res => { |
| | | this.isLoading = false; |
| | | if (res.status) { |
| | | console.log(res.data); |
| | | const newData = res.data.map(i => ({ |
| | | ...i, |
| | | InboundOrderStatus: InboundOrderStatus.find(item => item.value == i.orderStatus)?.label || 'æªç¥ç¶æ', |
| | | SumQty: i.details?.map(item => item.orderQuantity).reduce((prev, next) => prev + next, 0) || 0, |
| | | OverQty: i.details?.map(item => item.overInQuantity).reduce((prev, next) => prev + next, 0) || 0, |
| | | })); |
| | | |
| | | this.originalOrders = newData; // ç´æ¥æ¿æ¢ï¼ä¸å页追å |
| | | // æ ¹æ®æç´¢è¯è¿æ»¤æ¾ç¤º |
| | | if (this.searchValue) { |
| | | this.handleSearchInput(); |
| | | } else { |
| | | this.allReceivingOrders = [...this.originalOrders]; |
| | | } |
| | | } else { |
| | | this.$u.toast('æ°æ®å 载失败ï¼è¯·éè¯'); |
| | | } |
| | | }) |
| | | .catch(err => { |
| | | this.isLoading = false; |
| | | this.$u.toast('ç½ç»å¼å¸¸ï¼è¯·æ£æ¥ç½ç»'); |
| | | }); |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | | <style lang="scss"> |
| | | @import '@/common/uni-ui.scss'; |
| | | |
| | | page { |
| | | display: flex; |
| | | flex-direction: column; |
| | | box-sizing: border-box; |
| | | background-color: #efeff4; |
| | | min-height: 100%; |
| | | height: auto; |
| | | } |
| | | |
| | | .tips { |
| | | color: #67c23a; |
| | | font-size: 14px; |
| | | line-height: 40px; |
| | | text-align: center; |
| | | background-color: #f0f9eb; |
| | | height: 0; |
| | | opacity: 0; |
| | | transform: translateY(-100%); |
| | | transition: all 0.3s; |
| | | } |
| | | |
| | | .tips-ani { |
| | | transform: translateY(0); |
| | | height: 40px; |
| | | opacity: 1; |
| | | } |
| | | |
| | | .content { |
| | | width: 100%; |
| | | display: flex; |
| | | } |
| | | |
| | | .list-picture { |
| | | width: 100%; |
| | | height: 145px; |
| | | } |
| | | |
| | | .thumb-image { |
| | | width: 100%; |
| | | height: 100%; |
| | | } |
| | | |
| | | .ellipsis { |
| | | display: flex; |
| | | overflow: hidden; |
| | | } |
| | | |
| | | .uni-ellipsis-1 { |
| | | overflow: hidden; |
| | | white-space: nowrap; |
| | | text-overflow: ellipsis; |
| | | } |
| | | |
| | | .uni-ellipsis-2 { |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | display: -webkit-box; |
| | | -webkit-line-clamp: 2; |
| | | -webkit-box-orient: vertical; |
| | | } |
| | | |
| | | .customcss { |
| | | display: flex; |
| | | position: fixed; |
| | | width: 100%; |
| | | top: 10px; |
| | | text-align: center; |
| | | z-index: 999; |
| | | left: 30px; |
| | | height: 20%; |
| | | } |
| | | |
| | | .footer { |
| | | padding-top: 50%; |
| | | } |
| | | <style scoped> |
| | | .container { |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | gap: 10rpx; |
| | | } |
| | | .container view { |
| | | white-space: nowrap; |
| | | } |
| | | </style> |