货无忧
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

416 lines
9.7 KiB

<template>
<u-navbar title="拣货扫描" placeholder border=true :autoBack="true" leftIconSize='35'></u-navbar>
<view class="schbox">
<view>拣货日期</view>
<view @click.stop='showCalendar' class="inputsr">
<input :value='datatime' disabled placeholder="请选择时间"/>
<view @click.stop="">
<u-icon @click.stop='showCalendar' style="margin-right: 10rpx;" v-if="!datatime" name="calendar" color="#999999" size="50"></u-icon>
<u-icon @click.stop="cleartime" style="margin-right: 10rpx;" v-else name="close-circle" color="#999999" size="40"></u-icon>
</view>
</view>
<view @click="init">
查询
</view>
</view>
<view class="tabtip">
<view @click="setstate(0)">
<view :class="status==0?'xz':''">未完成</view>
</view>
<view @click="setstate(1)">
<view :class="status==1?'xz':''">完成</view>
</view>
</view>
<scroll-view class="sccv" scroll-y="true" @scrolltolower="jiazai">
<view class="mabx">
<view v-for="item in dataList">
<view class="topbox">
<view class="type1">
<view>
<text style="color: #90A0AF;">配车类型:</text>{{item.typeServiceStr}}
</view>
<view>
<text style="color: #90A0AF;">备货是否完成:</text>{{item.stockupStatusStr}}
</view>
</view>
<view class="type1">
<view>
<text style="color: #90A0AF;">客户:</text>{{item.customer}}
</view>
<view>
<text style="color: #90A0AF;">备货区域:</text>{{item.stockupArea}}
</view>
</view>
<view class="type3">
<view>
<text style="color: #90A0AF;">库位:</text>{{item.warehouseArea}}
</view>
</view>
<view class="type3">
<view>
<text style="color: #90A0AF;">托盘:</text>{{item.trays}}
</view>
</view>
<view class="type2">
<view>
<view>订单总数</view>
<view>{{item.orderNum}}</view>
</view>
<view>
<view>计划备货件数</view>
<view>{{item.planNum}}</view>
</view>
<view>
<view>备货件数</view>
<view>{{item.realNum}}</view>
</view>
</view>
</view>
<view class="bts">
<!-- <view @click="submitsuccess">
备货完成
</view> -->
<view @click="gostockuplist(item)">
去备货
</view>
</view>
</view>
</view>
</scroll-view>
<tips ref="tip"></tips>
<l-calendar v-model:value="show" :initStartDate='date[0]' :initEndDate='date[1]' @hide='showCalendar' @change="onConfirm"></l-calendar>
<!-- <hd-calendar mode="range" color='#D3832A' minDate='2023-01-01' @confirm="onConfirm" /> -->
</template>
<script lang="ts" setup>
import {
onLoad,
onShow,
onHide,
onUnload
} from '@dcloudio/uni-app'
import { distributionStockuppageList } from '@/api/user.js'
import { pageData } from '@/interfaces/pagesHome/pickingScan'
import { timeType } from '@/interfaces/pagesHome/allType'
import { inject, reactive, ref, toRefs, watchEffect } from "vue";
// const functions=inject('functions')
let details=reactive<pageData>({
datatime:'',
dataList:[],
show:false,
currentPage:1,
size:10,
stockupDate:'',
status:0,
})
let tip=ref(null)
const date = ref<number|string[]>([])
function showCalendar(){
details.show=!details.show
}
function onConfirm(e:any) {
console.log(e);
date.value[0]=e.startDate
date.value[1]=e.endDate
details.datatime=date.value[0]+' 至 '+date.value[1]
// details.datatime=(uni as any).$u.timeFormat(date.value[0], 'yyyy-mm-dd')+' 至 '+(uni as any).$u.timeFormat(date.value[1], 'yyyy-mm-dd')
}
watchEffect(()=>{
if((date.value as []).length!=0){
details.datatime=date.value[0]+' 至 '+date.value[1]
}
})
onLoad(()=>{
details.currentPage=1
date.value[0]=(uni as any).$u.timeFormat((new Date().valueOf()-1000*60*60*24*3), 'yyyy-mm-dd')
date.value[1]=(uni as any).$u.timeFormat((new Date().valueOf()), 'yyyy-mm-dd')
initpage()
})
function init(){
details.currentPage=1
initpage()
}
function jiazai(){
details.currentPage++
initpage()
}
async function initpage(){
let data={
current:details.currentPage,
size:details.size,
stockupDateStart:date.value[0],
stockupDateEnd:date.value[1],
status:details.status,
}
// for(let i=0;i<=1900;i++){
// await distributionStockuppageList(data)
// }
let response=await distributionStockuppageList(data)
if(details.currentPage==1){
details.dataList=response.data.records
}else{
if(response.data.records.lngth==0){
uni.showToast({
title:'已经到底了。',
icon:'none'
})
return
}
details.dataList=details.dataList.concat(response.data.records)
}
// details.dataList=response.data.records
}
function checktime(event:timeType){
console.log(event);
details.datatime = (uni as any).$u.timeFormat(event.value, 'yyyy-mm-dd');
details.show=false
console.log(details.datatime);
}
function gostockuplist(item:any){
uni.navigateTo({
url:'/pagesHome/pages/StockUplist/StockUplist?id='+item.reservationId+'&stockupArea='+item.stockupArea
})
}
function cleartime(){
// console.log(1231211);
details.datatime=''
date.value=[]
}
function setstate(state:number){
details.status=state
initpage()
}
function submitsuccess(){
tip.value.setdetails({
title:'提示',
content:'确认备货完成?',
confirmTxt:'确认',
isshow:true,
isshowcancel:true,
success:()=>{
tip.value.setisshow(false)
},
cancel:()=>{
tip.value.setisshow(false)
},
close:()=>{
tip.value.setisshow(false)
}
})
}
const {datatime,dataList,show,status}=toRefs(details)
</script>
<style lang="scss">
.inputsr{
width: 400upx !important;
height: 64upx;
background: #F5F5F6;
border-radius: 8upx 8upx 8upx 8upx;
opacity: 1;
border: 2upx solid #EEEEEE;
padding: 16upx 18upx;
box-sizing: border-box;
padding-right: 0;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 26upx;
font-weight: 400;
color: #092C4D;
>input{
flex: 1;
font-size: 26upx;
}
}
.sccv{
width: 100%;
height: 74vh;
margin-top: 20upx;
.mabx{
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
box-sizing: border-box;
padding: 20upx 32upx;
padding-top: 0upx;
>view{
width: 686upx;
background: #FFFFFF;
display: flex;
flex-direction: column;
box-sizing: border-box;
border-bottom: 1upx solid #ebebeb;
padding-bottom: 30upx;
background-color: #ffffff;
margin-bottom: 20upx;
padding-top: 20upx;
border-radius: 8upx;
.topbox{
display: flex;
flex-direction: column;
padding: 24upx;
border-bottom: 2upx solid #EEEEEE;
>.type1{
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20upx;
font-size: 28upx;
color: #161616;
>view{
width: 50%;
}
}
>.type2{
width: 100%;
display: flex;
align-items: center;
justify-content: space-around;
margin-bottom: 15upx;
font-size: 28upx;
color: #161616;
margin-top: 20upx;
>view{
display: flex;
flex-direction: column;
align-items: center;
>view:nth-of-type(1){
font-size: 28upx;
font-weight: 400;
color: #092C4D;
}
&:nth-of-type(1){
>view:nth-of-type(2){
color: #092C4D;
}
}
&:nth-of-type(2){
>view:nth-of-type(2){
color: #3AD8BC;
}
}
&:nth-of-type(3){
>view:nth-of-type(2){
color: #FA8C16;
}
}
>view:nth-of-type(2){
font-size: 36upx;
margin-top: 10upx;
}
}
}
>.type3{
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20upx;
font-size: 26upx;
color: #161616;
}
}
>.bts{
display: flex;
align-items: center;
justify-content: center;
margin-top: 20upx;
>view:nth-of-type(1){
width: 204upx;
height: 64upx;
background: #FFFFFF;
border-radius: 8upx;
opacity: 1;
border: 2upx solid #0086F1;
display: flex;
align-items: center;
justify-content: center;
font-size: 28upx;
font-weight: 400;
color: #0086F1;
margin-right: 100upx;
}
>view:nth-of-type(2){
width: 204upx;
height: 64upx;
background: #FFFFFF;
border-radius: 8upx;
opacity: 1;
border: 2upx solid #D3832A;
display: flex;
align-items: center;
justify-content: center;
font-size: 28upx;
font-weight: 400;
color: #D3832A;
}
}
}
}
}
.tabtip{
display: flex;
align-items: center;
justify-content: space-between;
>view{
width: 50%;
display: flex;
align-items: center;
justify-content: center;
background-color: #ffffff;
font-size: 32upx;
font-weight: 400;
color: #90A0AF;
>view{
height: 80upx;
border-bottom: 8upx solid #ffffff;
display: flex;
align-items: center;
justify-content: center;
}
}
.xz{
color: #D3832A;
border-bottom: 8upx solid #D3832A;
// border-radius: 5upx;
}
}
.schbox {
display: flex;
align-items: center;
justify-content: space-between;
padding: 15upx 32upx;
box-sizing: border-box;
background-color: #ffffff;
>view:nth-of-type(1) {
// width: 150upx;
font-size: 28upx;
font-weight: 400;
color: #092C4D;
}
>view:nth-of-type(2) {
width: 380upx;
// height: 64upx;
}
>view:nth-of-type(3) {
width: 128upx;
height: 64upx;
background: #D3832A;
border-radius: 8upx;
display: flex;
align-items: center;
justify-content: center;
font-size: 32upx;
font-weight: 400;
color: #FFFFFF;
}
}
</style>