货无忧
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.
 
 
 
 
 

523 lines
11 KiB

<template>
<u-navbar title="客户订单扫描" placeholder border=true :autoBack="true" leftIconSize='35'></u-navbar>
<view class="hdtp">
<view>
<view>
客户{{items.consignee}}
</view>
<view class="butlur" @click="showsdqs">
录入包条码
</view>
</view>
<view>
<view>备货是否完成{{items.isstock}}</view>
<view>装车是否完成{{items.isload}}</view>
</view>
</view>
<view class="hdtpnum">
<view>
<view>订单总数</view>
<view>{{items.ordNub}}</view>
</view>
<view>
<view>计划件数</view>
<view>{{items.reservationNum}}</view>
</view>
<view>
<view>装车件数</view>
<view>{{items.loadingNub}}</view>
</view>
<view>
<view>签收件数</view>
<view>{{signNub}}</view>
</view>
</view>
<view class="scinp">
<view>齐套状态</view>
<view>
<cusSelects @change='checktype' :data='typearr' :value="schanvalue" placeholder='全部' :arrLeft='5' size='145'
:clearable='true'></cusSelects>
</view>
<view class="inputs">
<input placeholder="请输入查询的订单号" v-model="inputtxt"/>
</view>
<view @click="initpage" class="btscan">查询</view>
</view>
<view class="tabtip">
<view @click="setorderStatus(1)">
<view :class="orderStatus==1?'xz':''">定制品</view>
</view>
<view @click="setorderStatus(2)">
<view :class="orderStatus==2?'xz':''">库存品</view>
</view>
</view>
<scroll-view class="scve" scroll-y="true">
<view class="mabx">
<view class="itec" @click="checkphon(index)" v-if="orderStatus==1" v-for="(item,index) in datalist">
<view class="contenbx1">
<view><text style="color: #90A0AF;">订单编号:</text>{{item.orderCode}}</view>
</view>
<view class="contenbx1">
<view><text style="color: #90A0AF;">配送数:</text>{{item.reservationNum}}</view>
<view><text style="color: #90A0AF;">已扫码数:</text>{{item.loadingNub}}</view>
</view>
<view class="xialaxz" v-if="listcheckindex==index">
<view v-for="ite in item.distributionAppParcelListVOS">
<view>包条码:{{ite.orderPackageCode}}</view>
<view>货物品类:{{ite.thirdProduct}}</view>
<view>扫描状态:{{ite.isScan?ite.isScan:'未扫'}}</view>
</view>
</view>
<view :class="item.completecode==3?'tip tp1':item.completecode==1?'tip tp2':'tip tp3'">{{item.complete}}</view>
</view>
<view class="itec" @click="checkphon(index)" v-if="orderStatus==2" v-for="(item,index) in datalist">
<view class="contenbx1">
<view><text style="color: #90A0AF;">SKU:</text>{{item.sku}}</view>
</view>
<view class="contenbx1">
<view><text style="color: #90A0AF;">物品:</text>{{item.descriptionGoods}}</view>
<view><text style="color: #90A0AF;">规格:</text>{{item.specification}}</view>
</view>
<view class="contenbx1">
<view><text style="color: #90A0AF;">单位:</text>{{item.logpmUnit}}</view>
<!-- <view><text style="color: #90A0AF;">签收:</text>{{item.signforNub}}</view> -->
</view>
<!-- <view :class="item.completecode==3?'tip tp1':item.completecode==1?'tip tp2':'tip tp3'">{{item.complete}}</view> -->
</view>
</view>
</scroll-view>
<tiplist ref="tiplists"></tiplist>
<saomiao2></saomiao2>
</template>
<script lang="ts" setup>
import {
deliveryorder,
signforinventory,
deliveryloadingscan,
deliveryloadinginventory
} from '@/api/user.js'
import {
onLoad,
onShow,
onHide,
onUnload
} from '@dcloudio/uni-app'
import cusSelects from '@/compoment/cus-selects-fan/cus-selects-fan.vue'
import { computed, reactive, ref, toRefs } from "vue";
let details = reactive({
schanvalue: '',
typearr: [
{
value: 3,
label: '齐套'
},
{
value: 2,
label: '部分扫'
},
{
value: 1,
label: '未扫'
}
],
items:{} as any,
datalist:[],
scancode:'',
orderStatus:1,
id:'',
orderType:0,
inputtxt:'',
listcheckindex:-1
})
const tiplists=ref(null)
onLoad((op)=>{
details.items=JSON.parse(op.item)
details.id=op.id
initpage()
uni.$on('scancodedate', function(code) {
if (code) {
console.log(code);
details.scancode = code
scandata()
}
})
})
const signNub=computed(()=>{
let num=0
details.datalist.map(item=>{
if(item.loadingNub){
num+=item.loadingNub
}
})
return num
})
function showsdqs(){
tiplists.value.setdetails({
isshow:true,
tipstate:1,
title:'请输入扫描的码',
placeholder:'请输入扫描的码',
inputtext:'',
success:(detail)=>{
details.scancode=detail.inputtext
scandata()
tiplists.value.setdetails({isshow:false})
},
cancel:()=>{
tiplists.value.setdetails({isshow:false})
},
close:()=>{
tiplists.value.setdetails({isshow:false})
}
})
}
async function initpage(){
let data={
reservationId:details.items.id,
completecode:details.orderType,
orderCode:details.inputtxt
}
details.datalist=[]
let response=null
if(details.orderStatus==1){
response=await deliveryorder(data)
}else if(details.orderStatus==2){
response=await signforinventory(data)
}
details.datalist=response.data.records||[]
}
function checktype(e) {
if (e == '') {
details.schanvalue = ''
details.orderType=0
}
details.typearr.map(item => {
if (item.value == e) {
details.schanvalue = item.label
details.orderType=item.value
console.log(details.schanvalue)
}
})
}
function setorderStatus(state:number){
details.orderStatus=state
initpage()
}
/** 扫描接口
* */
async function scandata(){
let loadingId=uni.getStorageSync('checkvehicle').id
if(details.orderStatus==1){
let data={
deliveryId:details.id,
loadingId,
type:1,
barcode:details.scancode
}
let res=await deliveryloadingscan(data)
console.log(res);
if(res.code==200){
uni.showToast({
title:res.msg,
icon:'none'
})
initpage()
}else{
uni.showToast({
title:res.msg,
icon:'none'
})
}
}else if(details.orderStatus==2){
let data={
reservationId:details.items.id,
deliveryId:details.id,
loadingId,
type:1,
barcode:details.scancode
}
let res=await deliveryloadinginventory(data)
console.log(res);
if(res.code==200){
uni.showToast({
title:res.msg,
icon:'none'
})
}else{
uni.showToast({
title:res.msg,
icon:'none'
})
}
}
initpage()
}
function checkphon(index:number){
// details.listcheckindex=index
if(details.listcheckindex==index){
details.listcheckindex=-1
}else{
details.listcheckindex=index
}
}
const { listcheckindex,inputtxt,orderStatus,schanvalue, typearr , items, datalist } = toRefs(details)
</script>
<style lang="scss">
.xialaxz{
display: flex;
flex-direction: column;
>view{
display: flex;
align-items: flex-start;
justify-content: space-between;
border-top: 1upx solid #00000010;
padding: 20upx 0;
box-sizing: border-box;
font-size: 28upx;
color: #092C4D;
>view{
word-wrap: break-word;
word-break: break-all;
margin-right: 10upx;
&:nth-last-child(1){
margin-right: 0upx;
}
}
}
}
.butlur{
width: 200upx !important;
height: 64upx !important;
background: #D3832A;
border-radius: 8upx;
display: flex;
align-items: center;
justify-content: center;
font-size: 32upx;
font-weight: 400;
color: #FFFFFF;
}
.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;
}
}
.hdtp{
padding: 34upx 32upx;
box-sizing: border-box;
background-color: #ffffff;
display: flex;
flex-direction: column;
align-items: center;
>view{
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 28upx;
font-weight: 400;
color: #092C4D;
margin-bottom: 24upx;
&:nth-last-child(1){
margin-bottom: 0;
}
>view{
width: 50%;
// flex: 1;
}
}
}
.scve {
width: 100%;
height: 50vh;
margin-top: 20upx;
.mabx {
display: flex;
flex-direction: column;
align-items: center;
>.itec {
width: 686upx;
// height: 176upx;
background: #FFFFFF;
border-radius: 8upx;
padding: 36upx 24upx;
box-sizing: border-box;
position: relative;
margin-bottom: 20upx;
&:nth-last-child(1) {
margin-bottom: 0;
}
>.contenbx1 {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 28upx;
color: #092C4D;
margin-bottom: 20upx;
&:nth-last-child(1) {
margin-bottom: 0;
}
>view {
flex: 1;
}
}
.tip {
position: absolute;
right: 0;
top: 0;
width: 96upx;
height: 48upx;
border-radius: 0 8upx 0 8upx;
display: flex;
align-items: center;
justify-content: center;
font-size: 24upx;
}
.tp1 {
background-color: #0086F120;
color: #0086F1;
}
.tp2 {
background-color: #F8544B20;
color: #F8544B;
}
.tp3 {
background-color: #FA8C1620;
color: #FA8C16;
}
}
}
}
.scinp {
display: flex;
align-items: center;
justify-content: space-between;
padding: 12upx 32upx;
box-sizing: border-box;
background-color: #ffffff;
>view:nth-of-type(1) {
font-size: 28upx;
font-weight: 400;
color: #092C4D;
}
.inputs {
width: 276upx;
height: 64upx;
background: #F5F5F6;
border-radius: 8upx;
opacity: 1;
border: 2upx solid #EEEEEE;
padding: 10upx;
box-sizing: border-box;
font-size: 24upx;
font-weight: 400;
color: #AFB4BA;
>input{
flex: 1;
font-size: 24upx;
color: #092C4D;
}
}
.btscan {
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;
}
}
.hdtpnum {
display: flex;
align-items: center;
justify-content: space-around;
background-color: #ffffff;
padding: 28upx 0;
border-bottom: 3upx solid #EEEEEE;
>view {
display: flex;
align-items: center;
flex-direction: column;
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: #0086F1;
}
}
&:nth-of-type(3) {
>view:nth-of-type(2) {
color: #3AD8BC;
}
}
&:nth-of-type(4) {
>view:nth-of-type(2) {
color: #FA8C16;
}
}
>view:nth-of-type(2) {
font-size: 36upx;
font-weight: 400;
color: #092C4D;
margin-top: 20upx;
}
}
}
</style>