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

516 lines
11 KiB

<template>
<!-- <u-navbar title="签收明细扫描" placeholder border=true :autoBack="true" leftIconSize='35'></u-navbar> -->
<u-navbar title="签收明细扫描" bgColor='#D3832A' leftIconColor='#ffffff' titleStyle='color:#ffffff' placeholder
:autoBack="true" leftIconSize='35'></u-navbar>
<view class="headtop">
<view>
<view>配车类型{{items.type_name}}</view>
</view>
<view>
<view>车牌号{{items.vehicleName}}</view>
<view>司机{{items.driverName}}</view>
</view>
</view>
<view class="tabmabx">
<view>
<uni-table :loading='false' emptyText="暂无更多数据">
<uni-tr>
<uni-th width="60" align="center"></uni-th>
<uni-th width="70" align="center">配送客户数</uni-th>
<uni-th width="70" align="center">订单总数</uni-th>
<uni-th width="70" align="center">签收件数</uni-th>
</uni-tr>
<uni-tr v-for="item in [1,2]">
<uni-td align="center" class="jhjs">{{item==1?'计划':'完成'}}</uni-td>
<uni-td align="center">{{item==1?items.customersNumber:items.loadCusNub}}</uni-td>
<uni-td align="center">{{item==1?items.orderNumber:items.loadOrdNub}}</uni-td>
<uni-td align="center">{{item==1?items.signNub:items.signNubSr}}</uni-td>
</uni-tr>
</uni-table>
</view>
</view>
<view class="scinp">
<view class="left">
<view class="titl">齐套状态</view>
<view>
<cusSelects @change='checktype(1,$event)' :data='signforStatearr' :value="signforStatevalue"
placeholder='全部' :arrLeft='5' size='145' :clearable='true'></cusSelects>
</view>
</view>
<!-- <view class="titl">包件类型</view>
<view>
<cusSelects @change='checktype(2,$event)' :data='typearr' :value="schanvalue" placeholder='全部' :arrLeft='5' size='145'
:clearable='true'></cusSelects>
</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="scbx" scroll-y="true">
<view class="mabox">
<view class="item" v-if="orderStatus==1" v-for="item in datalist">
<view class="toptitl">
<view class="toplft" @click.stop="goorderdetail(item)">
订单号:{{item.orderCode}}
</view>
<!-- <view :class="item==3?'tis bf':'tis'">
整托备货
</view> -->
</view>
<view class="boxcontt">
<view>
<view><text style="color: #90A0AF;">包条码:</text>{{item.packetBarCode}}</view>
<view><text style="color: #90A0AF;">货物名称:</text>{{item.materialName}}</view>
</view>
<view>
<view :class="item.signforState==1?'scanstateerr':'scanstatesucc'">
<text style="color: #90A0AF;">扫描状态:</text>
{{item.signforState==1?'未扫码':'已扫码'}}
</view>
<!-- <view><text style="color: #90A0AF;">完成件数:</text>12</view> -->
</view>
</view>
<!-- <view class="buttts">
<view class="anj">
异常上报
</view>
</view> -->
</view>
<view class="item" v-if="orderStatus==2" v-for="item in datalist">
<view class="toptitl">
<view class="toplft">
SKU:{{item.sku}}
</view>
</view>
<view class="boxcontt">
<view>
<view><text style="color: #90A0AF;">物品:</text>{{item.descriptionGoods}}</view>
<view><text style="color: #90A0AF;">规格:</text>{{item.specification}}</view>
</view>
<view>
<view><text style="color: #90A0AF;">单位:</text>{{item.logpmUnit}}</view>
<!-- <view><text style="color: #90A0AF;">自提数:</text>{{item.quantity}}</view> -->
</view>
</view>
</view>
</view>
</scroll-view>
</template>
<script lang="ts" setup>
import cusSelects from '@/compoment/cus-selects-fan/cus-selects-fan.vue'
import {
signforwrap,
signforwrapIn
} from '@/api/user.js'
import {
onLoad,
onShow,
onHide,
onUnload
} from '@dcloudio/uni-app'
import { reactive, toRefs, ref } from "vue";
let details = reactive({
orderCodevalue: '',
signforStatevalue: '',
signforStatearr: [
{
value: 1,
label: '齐套'
},
{
value: 2,
label: '部分扫'
},
{
value: 3,
label: '未扫'
}
],
statearr: [
{
value: 1,
label: '齐套'
},
{
value: 2,
label: '部分扫'
},
{
value: 3,
label: '未扫'
}
],
items: {} as any,
id: '',
datalist: [],
orderStatus: 1,
signforState: '' as string | number,
})
onShow(() => {
// #ifdef APP
uni.$off('scancodedate')
// #endif
})
onLoad((op) => {
details.items = JSON.parse(op.item)
details.id = JSON.parse(op.item).id
initpage()
})
function goorderdetail(item) {
uni.navigateTo({
url: '/pagesHome/pages/orderDetails/orderDetails?orderCode=' + item.orderCode
})
}
function setorderStatus(state : number) {
details.orderStatus = state
initpage()
}
async function initpage() {
details.datalist = []
let data = {
id: details.id,
signforState: details.signforState
}
if (details.orderStatus == 1) {
let res = await signforwrap(data)
if (res.code !== 200) return
console.log(res);
details.datalist = res.data.records
} else if (details.orderStatus == 2) {
let res = await signforwrapIn(data)
if (res.code !== 200) return
console.log(res);
details.datalist = res.data.records
}
}
function checktype(type, e) {
console.log(type, e);
if (type == 1) {
if (e == '') {
details.signforStatevalue = ''
details.signforState = ''
}
details.signforStatearr.map(item => {
if (item.value == e) {
details.signforStatevalue = item.label
details.signforState = item.value
console.log(details.signforStatevalue)
}
})
initpage()
} else if (type == 2) {
// if(e==''){
// details.schanvalue=''
// }
// details.typearr.map(item=>{
// if(item.value==e){
// details.schanvalue=item.label
// details.orderStatus=item.value
// console.log(details.schanvalue)
// }
// })
}
}
const { orderStatus, signforStatearr, signforStatevalue, items, datalist } = toRefs(details)
</script>
<style lang="scss">
.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;
}
}
.scbx {
width: 100%;
height: 45vh;
padding-top: 20upx;
.mabox {
display: flex;
flex-direction: column;
align-items: center;
>.item {
width: 686upx;
// height: 378upx;
background: #FFFFFF;
border-radius: 8upx;
display: flex;
flex-direction: column;
align-items: center;
// padding: 10upx 20upx;
box-sizing: border-box;
border-bottom: 1upx solid #ebebeb;
margin-bottom: 20upx;
padding-bottom: 10upx;
&:nth-last-child(1) {
margin-bottom: 5upx;
}
.toptitl {
width: 100%;
display: flex;
align-items: flex-start;
justify-content: space-between;
border-bottom: 2upx solid #EEEEEE;
padding: 34upx 24upx;
box-sizing: border-box;
.toplft {
font-size: 32upx;
font-weight: 400;
color: #092C4D;
word-wrap: break-word;
word-break: break-all;
}
.tis {
width: 180upx;
font-size: 32upx;
font-weight: 400;
color: #0086F1;
display: flex;
justify-content: flex-end;
}
.bf {
color: #D3832A;
}
}
.boxcontt {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
padding: 32upx 24upx;
box-sizing: border-box;
font-size: 28upx;
>view {
width: 100%;
display: flex;
align-items: flex-start;
justify-content: space-between;
&:nth-of-type(1) {
margin-bottom: 20upx;
}
>view {
width: 50%;
}
}
.scanstatesucc {
color: #3AD8BC;
}
.scanstateerr {
color: #F8544B;
}
}
.buttts {
height: 100upx;
display: flex;
align-items: center;
justify-content: space-around;
width: 100%;
box-sizing: border-box;
border-top: 2upx solid #EEEEEE;
.antu {
border: 2upx solid #0086F1;
color: #0086F1;
}
.anj {
border: 2upx solid #D3832A;
color: #D3832A;
}
>view {
width: 204upx;
height: 64upx;
background: #FFFFFF;
border-radius: 8upx;
opacity: 1;
font-size: 28upx;
display: flex;
align-items: center;
justify-content: center;
}
}
}
}
}
.scinp {
display: flex;
align-items: center;
justify-content: space-between;
padding: 12upx 32upx;
box-sizing: border-box;
background-color: #ffffff;
>.left {
display: flex;
align-items: center;
justify-content: center;
>.titl {
font-size: 28upx;
font-weight: 400;
color: #092C4D;
margin-right: 30upx;
}
.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;
}
}
.tabmabx {
width: 100%;
padding: 0 32upx;
box-sizing: border-box;
background-color: #ffffff;
padding-bottom: 20upx;
.uni-table-th {
background-color: #F8FBFF;
font-size: 28upx;
font-weight: 400;
color: #092C4D;
}
.jhjs {}
.uni-table-tr:nth-last-child(2)>.uni-table-td {
font-size: 36upx;
font-weight: 400;
color: #092C4D;
&:nth-of-type(1) {
font-size: 28upx !important;
font-weight: 400;
color: #092C4D !important;
}
}
.uni-table-tr:nth-last-child(1)>.uni-table-td {
border-bottom: none !important;
font-size: 36upx;
font-weight: 400;
color: #0086F1;
&:nth-of-type(1) {
font-size: 28upx !important;
font-weight: 400;
color: #092C4D !important;
}
}
>view {
border-radius: 8upx;
border: 1upx solid #EEEEEE;
padding-bottom: -2upx;
}
}
.headtop {
display: flex;
flex-direction: column;
padding: 34upx 32upx;
box-sizing: border-box;
background-color: #ffffff;
>view {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 28upx;
font-weight: 400;
color: #092C4D;
margin-bottom: 24upx;
&:nth-of-type(2) {
margin-bottom: 0;
}
>view {
flex: 1;
}
}
}
</style>