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

480 lines
9.8 KiB

<template>
<!-- <u-navbar title="扫描" placeholder border=true :autoBack="true" leftIconSize='35'></u-navbar> -->
<u-navbar
title="详情"
placeholder
:autoBack="true"
leftIconSize='35'
bgColor='#d3832a'
leftIconColor='#ffffff'
titleStyle='color:#ffffff'
></u-navbar>
<image mode="widthFix" class="bgimg" src="/pagesHome/static/bgby.png"></image>
<view class="mabxtop">
<view class="type1s">
<view>
<view>{{detaobj.orderCode}}</view>
<view>订单号</view>
</view>
<view>
<view>{{detaobj.totalNumber}}</view>
<view>订单总数</view>
</view>
</view>
<!-- <view class="type2s">
<view>
已扫
</view>
<view>
{{detaobj.scanNum||0}}
</view>
</view> -->
</view>
<!-- <view class="headtop">
<view class="typto">
<view>
<view>物料编码</view>
<view>LS00125</view>
</view>
<view>
<view>物料名称</view>
<view>智能冲洗梳妆台0021</view>
</view>
</view>
<view class="typto">
<view>
<view>已扫</view>
<view>19</view>
</view>
</view>
</view>
<view class="butsca">
<view>
全选
</view>
<view>
反选
</view>
<view @click="removeall">
批量删除
</view>
</view> -->
<view class="maboxite">
<scroll-view scroll-y="true" class="scvbox">
<view class="maxboxs">
<view class="items" v-for="(item,index) in list">
<view class="rigth">
<view class="type1">
<view>
<view>包条码:</view>
<view :style="item.isFleeing?'color: red;':''">{{item.orderPackageCode||'无数据'}}</view>
</view>
</view>
<view class="type1">
<view>
<view>托盘码:</view>
<view :style="item.isFleeing?'color: red;':''">{{item.trayName||'无数据'}}</view>
</view>
</view>
<view class="type1">
<view>
<view>仓库:</view>
<view :style="item.isFleeing?'color: red;':''">{{item.warehouseName||'无数据'}}</view>
</view>
</view>
<view class="type1">
<view>
<view>物料编码:</view>
<view :style="item.isFleeing?'color: red;':''">{{item.materialCode||'无数据'}}</view>
</view>
</view>
<view class="type1">
<view>
<view>物料名称:</view>
<view :style="item.isFleeing?'color: red;':''">{{item.materialName||'无数据'}}</view>
</view>
</view>
<view class="type1">
<view>
<view>类型:</view>
<view :style="item.isFleeing?'color: red;':''">{{item.pinming||'无数据'}}</view>
</view>
</view>
<view class="type1">
<view>
<view>货区:</view>
<view :style="item.isFleeing?'color: red;':''">{{item.areaTitle||'无数据'}}</view>
</view>
</view>
<view class="type1">
<view>
<view>货架:</view>
<view :style="item.isFleeing?'color: red;':''">{{item.shelfTitle||'无数据'}}</view>
</view>
</view>
<view class="type1">
<view>
<view>货位:</view>
<view :style="item.isFleeing?'color: red;':''">{{item.allocationTitle||'无数据'}}</view>
</view>
</view>
<view class="type1">
<view>
<view>扫描状态:</view>
<view>{{item.trayId?'已扫':'未扫'}}</view>
</view>
</view>
</view>
</view>
</view>
</scroll-view>
</view>
<tips ref="tip"></tips>
</template>
<script lang="ts" setup>
import {
warehouseUpdownTypeorderUpshelfDetail,
} from '@/api/user.js'
import {
onLoad,
onShow,
onHide,
onUnload
} from '@dcloudio/uni-app'
import { reactive, ref, toRefs, watchEffect } from "vue";
let tip=ref(null)
let details=reactive({
list:[],
showlist:[],
tabcek:[],
xzckindex:0,
checkindex:[],
orderCode:'',
trayCode:'',
detaobj:{
orderCode:'',
scanNum:0,
totalNumber:0,
},
ischeckall:false
})
onLoad((op)=>{
details.orderCode=op.orderCode
console.log('details.orderCode',details.orderCode);
initpage()
})
async function initpage(){
let data={
orderCode:details.orderCode,
}
let response=await warehouseUpdownTypeorderUpshelfDetail(data)
if(!response.data){
uni.showToast({
title:response.msg,
icon:'none'
})
return
}
details.list=response.data.list
details.detaobj=response.data
}
const { ischeckall,showlist,tabcek,xzckindex,detaobj,checkindex,list }=toRefs(details)
</script>
<style lang="scss">
.scviewtary{
width: 684upx;
display: flex;
flex-direction: column;
padding: 20upx;
box-sizing: border-box;
background-color: #ffffff;
margin: auto;
margin-top: 20upx;
border-radius: 20upx;
.scbox{
width: 100%;
.viebxs{
display: flex;
align-items: center;
>view{
width: 260upx;
height: 88upx;
background: #F5F5F6;
border-radius: 8upx;
margin-right: 20upx;
display: flex;
align-items: center;
justify-content: center;
font-size: 32upx;
font-weight: 400;
color: #5A6875;
}
.xz{
background-color: #D3832A !important;
color: #ffffff !important;
}
}
}
}
.maboxite{
width: 684upx;
display: flex;
flex-direction: column;
padding: 20upx;
box-sizing: border-box;
background-color: #ffffff;
margin: auto;
margin-top: 20upx;
border-radius: 20upx;
position: relative;
>.headtops{
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
padding: 10upx 0;
box-sizing: border-box;
border-bottom: 4upx solid #EEEEEE;
padding-bottom: 30upx;
>view:nth-of-type(1){
display: flex;
align-items: center;
justify-content: center;
>image{
width: 48upx;
height: 48upx;
margin-right: 20upx;
}
>view{
font-size: 32upx;
font-weight: 400;
color: #020B18;
}
}
>view:nth-of-type(2){
font-size: 32upx;
font-weight: 400;
color: #D3832A;
}
}
}
.mabxtop{
position: relative;
width: 684upx;
// height: 348upx;
background: #FFFFFF;
border-radius: 20upx;
margin: auto;
margin-top: 20upx;
padding: 60upx;
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
>.type1s{
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 70upx;
&:nth-last-child(1){
margin-bottom: 0;
}
>view{
width: 50%;
display: flex;
flex-direction: column;
align-items: flex-start;
>view:nth-of-type(1){
font-size: 30upx;
font-weight: 400;
color: #020B18;
}
>view:nth-of-type(2){
font-size: 28upx;
font-weight: 400;
color: #90A0AF;
}
}
}
.type2s{
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
>view:nth-of-type(1){
width: 50%;
font-size: 32upx;
font-weight: 400;
color: #020B18;
}
>view:nth-of-type(2){
width: 50%;
font-size: 32upx;
font-weight: 400;
color: #1197EB;
}
}
}
.bgimg{
position: absolute;
left: 0;
top: 0;
width: 100%;
}
.scvbox{
width: 100%;
height: 63vh;
margin-top: 20upx;
.maxboxs{
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
>.items{
width: 100%;
display: flex;
// flex-direction: column;
align-items: flex-start;
padding: 20upx 0;
box-sizing: border-box;
background-color: #ffffff;
border-radius: 10upx;
margin-bottom: 10upx;
border-bottom: 4upx solid #EEEEEE;
&:nth-last-child(1){
// margin-bottom:10upx;
border-bottom:none;
}
.rigth{
flex: 1;
}
.lefticon{
display: flex;
align-items: flex-start;
justify-content: center;
margin-right: 30upx;
>image{
width: 48upx;
height: 48upx;
}
}
.removeicon{
height: 100%;
display: flex;
align-items: center;
justify-content: center;
>image{
width: 64upx;
height: 64upx;
}
}
.removebt{
width: 128upx;
height: 64upx;
background: #ec2400;
border-radius: 8upx 8upx 8upx 8upx;
opacity: 1;
display: flex;
align-items: center;
justify-content: center;
font-size: 32upx;
font-weight: 400;
color: #FFFFFF !important;
}
.type1{
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20upx;
>view{
display: flex;
align-items: flex-start;
font-size: 28upx;
>view:nth-of-type(1){
color: #90A0AF;
}
>view:nth-of-type(2){
color: #092C4D;
flex: 1;
}
}
}
}
}
}
.butsca{
display: flex;
align-items: center;
justify-content: flex-start;
background-color: #ffffff;
padding: 20upx 15upx;
box-sizing: border-box;
>view{
width: 204upx;
height: 64upx;
background: #FFFFFF;
border-radius: 8upx 8upx 8upx 8upx;
opacity: 1;
border: 2upx solid #D3832A;
display: flex;
align-items: center;
justify-content: center;
font-size: 28upx;
font-weight: 400;
color: #D3832A;
margin-right: 30upx;
&:nth-last-child(1){
margin-right: 0;
}
}
}
.headtop{
display: flex;
flex-direction: column;
padding: 34upx 32upx;
box-sizing: border-box;
background-color: #ffffff;
>view{
display: flex;
align-items: flex-start;
justify-content: space-between;
font-size: 28upx;
font-weight: 400;
color: #092C4D;
margin-bottom: 24upx;
>view{
display: flex;
align-items: flex-start;
// flex-wrap: wrap;
>view:nth-of-type(1){
width: 170upx;
color: #90A0AF;
}
>view:nth-of-type(2){
color: #092C4D;
word-wrap: break-word;
word-break: break-all;
}
}
&:nth-of-type(2){
margin-bottom: 0;
}
>view{
flex: 1;
}
}
}
</style>