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

470 lines
10 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="hedtopt">
<view class="typto">
<view>配车类型{{items.type_name}}</view>
<view>配车状态{{items.deliStatus_name}}</view>
</view>
<view class="typto">
<view>车牌号{{items.vehicleName}}</view>
<view>司机{{items.driverName}}</view>
</view>
<view class="typto">
<view>装卸班组{{items.loadingTeamName}}</view>
<view>备货是否完成{{items.isstock}}</view>
</view>
<view class="kehupeison">
<view>
<view>配送客户数</view>
<view>{{items.customersNumber}}</view>
</view>
<view>
<view>订单总数</view>
<view>{{items.orderNumber}}</view>
</view>
<view>
<view>配送件数</view>
<view>{{deliveryNumber}}</view>
</view>
<view>
<view>签收件数</view>
<view>{{items.signNub}}</view>
</view>
</view>
</view>
<scroll-view scroll-y="true" class="scvbx">
<view class="mabx">
<view class="its" v-for="item in datalist">
<view class="title">
<view>客户:{{item.consignee}}</view>
<view class="statetype">{{item.deliveryStatus}}</view>
</view>
<view class="conxb">
<view>
<view>订单总数</view>
<view>{{item.ordNub}}</view>
</view>
<view>
<view>配送件数</view>
<view>{{item.reservationNum}}</view>
</view>
<view>
<view>扫描件数</view>
<view>{{item.signNub}}</view>
</view>
</view>
<view class="tbck">
<view>
<view @click="getLocation(item)">定位打卡</view>
<view @click.stop="gosinorderscan(item)">签到扫描</view>
<view @click="uplodimg(item)">上传签收图片</view>
</view>
<view @click="allclick(item)" v-if="authbuts.indexOf('批量签收')!=-1&&item.deliveryStatus!='完成配送'">
批量签收
</view>
</view>
</view>
</view>
</scroll-view>
<tiplist ref="tiplists"></tiplist>
</template>
<script lang="ts" setup>
import {
signforcustom,
signforsignforack,
signforpositioning,
signforoneclick,
} from '@/api/user.js'
import {
onLoad,
onShow,
onHide,
onUnload
} from '@dcloudio/uni-app'
import { computed, reactive, ref, toRefs } from "vue";
let details=reactive({
items:{} as any,
id:'',
datalist:[] as any,
authbuts:uni.getStorageSync('authbuts')
})
const tiplists=ref(null)
onLoad((op)=>{
details.items=JSON.parse(op.item)
details.id=JSON.parse(op.item).id
initpage()
})
onShow(()=>{
initpage()
})
const deliveryNumber=computed(()=>{
let num=0
details.datalist.map(item=>{
if(item.reservationNum){
num+=item.reservationNum
}
})
return num
})
async function initpage(){
let data={
id:details.id
}
let response=await signforcustom(data)
details.datalist=response.data.records
}
// function gosindetascan(item){
// uni.navigateTo({
// url:'/pagesHome/pages/SignDetailScan/SignDetailScan?item='+JSON.stringify(item)
// })
// }
function uplodimg(item){
tiplists.value.setdetails({
isshow:true,
tipstate:3,
placeholder:'请填写备注',
confirmTxt:'确认签收',
inputtext:'',
imglist:[],
maximglength:3,
success:async (detail)=>{
let data={
deliveryId:details.id,
reservationId:item.id,
deliverySignPictures:detail.imglist.join(','),
driverRemarks:detail.inputtext
}
let res=await signforsignforack(data)
console.log(res);
if(res.code==200){
uni.showToast({
title:res.msg,
icon:'none'
})
initpage()
}else{
uni.showToast({
title:res.msg,
icon:'none'
})
}
tiplists.value.setdetails({isshow:false})
},
cancel:()=>{
tiplists.value.setdetails({isshow:false})
},
close:()=>{
tiplists.value.setdetails({isshow:false})
},
})
}
async function allclick(item:any){
tiplists.value.setdetails({
isshow:true,
tipstate:3,
placeholder:'请填写备注',
confirmTxt:'确认批量签收',
inputtext:'',
imglist:[],
maximglength:3,
success:async (detail)=>{
let data={
deliveryId:details.id,
reservationId:item.id,
deliverySignPictures:detail.imglist.join(','),
driverRemarks:detail.inputtext,
}
let res=await signforoneclick(data)
console.log(res);
if(res.code==200){
uni.showToast({
title:'批量签收成功',
icon:'none'
})
initpage()
}else{
uni.showToast({
title:res.msg,
icon:'none'
})
}
tiplists.value.setdetails({isshow:false})
},
cancel:()=>{
tiplists.value.setdetails({isshow:false})
},
close:()=>{
tiplists.value.setdetails({isshow:false})
},
})
}
function getLocation(item){
console.log('getLocation-------');
uni.getLocation({
type: 'wgs84',
geocode:true,
isHighAccuracy:true,
success:async function (res) {
console.log(JSON.stringify(res));
// let addr=res.address
// console.log(`${addr.province}${addr.city}${addr.district}${addr.street}${addr.streetNum}`);
console.log('当前位置的经度:' + res.longitude);
console.log('当前位置的纬度:' + res.latitude);
let data={
deliveryId:details.id,
reservationId:item.id,
positioning:res.longitude+','+res.latitude,
positioningAdr:''
}
let response=await signforpositioning(data)
console.log(response);
if(response.code==200){
uni.showToast({
title:'定位打卡成功',
icon:'none'
})
initpage()
}else{
uni.showToast({
title:response.msg,
icon:'none'
})
}
},
fail:(err)=>{
uni.showToast({
title:err.errMsg,
icon:'none'
})
console.log(err);
}
});
}
function gosinorderscan(item){
uni.navigateTo({
url:'/pagesHome/pages/signOrderScan/signOrderScan?item='+JSON.stringify(item)+'&deliveryId='+details.id
})
}
const { authbuts,items,datalist }=toRefs(details)
</script>
<style lang="scss">
.scvbx{
width: 100%;
height: 60vh;
margin-top: 20upx;
.mabx{
display: flex;
flex-direction: column;
align-items: center;
>.its{
width: 686upx;
display: flex;
flex-direction: column;
margin-bottom: 20upx;
background: #FFFFFF;
border-radius: 8upx;
&:nth-last-child(1){
margin-bottom: 0;
}
>.title{
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
padding: 34upx 24upx;
box-sizing: border-box;
border-bottom: 3upx solid #EEEEEE;
>view:nth-of-type(1){
font-size: 32upx;
color: #092C4D;
}
>view:nth-of-type(2){
font-size: 32upx;
color: #FA8C16;
}
}
>.conxb{
display: flex;
align-items: center;
justify-content: space-around;
padding: 38upx 0;
border-bottom: 3upx solid #EEEEEE;
box-sizing: border-box;
>view{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
&:nth-of-type(1){
>view:nth-of-type(2){
color: #0086F1;
}
}
&: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;
font-weight: 400;
margin-top: 20upx;
}
}
}
.tbck{
display: flex;
flex-direction: column;
padding: 20upx;
>view:nth-of-type(1){
display: flex;
align-items: center;
justify-content: space-between;
width: 646upx;
margin: auto;
margin-bottom: 20upx;
>view{
box-sizing: border-box;
}
>view:nth-of-type(1){
width: 210upx;
height: 64upx;
background: #FFFFFF;
border-radius: 8upx;
opacity: 1;
border: 2upx solid #0086F1;
display: flex;
align-items: center;
justify-content: center;
font-size: 28upx;
color: #0086F1;
}
>view:nth-of-type(2){
width: 210upx;
height: 64upx;
background: #FFFFFF;
border-radius: 8upx;
opacity: 1;
border: 2upx solid #D3832A;
display: flex;
align-items: center;
justify-content: center;
font-size: 28upx;
color: #D3832A;
}
>view:nth-of-type(3){
width: 210upx;
height: 64upx;
background: #FFFFFF;
border-radius: 8upx;
opacity: 1;
border: 2upx solid #D3832A;
display: flex;
align-items: center;
justify-content: center;
font-size: 28upx;
color: #D3832A;
}
}
>view:nth-of-type(2){
width: 646upx;
height: 64upx;
background: #FFFFFF;
border-radius: 8upx;
opacity: 1;
border: 2upx solid #D3832A;
display: flex;
align-items: center;
justify-content: center;
font-size: 28upx;
color: #D3832A;
margin: auto;
box-sizing: border-box;
}
}
}
}
}
.hedtopt{
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
background-color: #ffffff;
padding: 36upx 32upx;
box-sizing: border-box;
.typto{
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
font-size: 28upx;
font-weight: 400;
color: #092C4D;
margin-bottom: 20upx;
&:nth-last-child(1){
margin-bottom: 0;
}
>view{
flex: 1;
}
}
.kehupeison{
width: 100%;
display: flex;
align-items: center;
justify-content: space-around;
margin-top: 20upx;
>view{
display: flex;
flex-direction: column;
align-items: center;
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>