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

612 lines
14 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>{{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 :style="item.isUrgent=='2'?'color: red;':''">客户:{{item.consignee}} {{item.isUrgent=='2'?'(加急)':''}}
</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="remarks">
备注:{{item.remarks}}
</view>
<view class="tbck">
<view class="buts">
<view :class="item.positioning==1?'ydk':''" @click="getLocation(item)">
{{item.positioning==1?'已打卡':'定位打卡'}}
</view>
<view @click="gosinorderscan(item)">签到扫描</view>
<view @click="uplodimg(item)">上传签收图片</view>
</view>
<view @click="gosetorice(item)" class="mabut">
设置增值服务
</view>
<view class="mabut" @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 {
signforprices,
signforcustom,
signforsignforack,
signforUpdatePicture,
signforpositioning,
signforoneclick,
dictbizdictionary
} 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'),
imgList: [],
isChange: false,
changeImageList: [],
/**
* 必填照片
* "photo_1": 上门照
* "photo_2": 堆码照
* "photo_5": 签收照
*/
ImagesRequiredFields: [
{
key: "photo_1",
isShowTitle: false
},
{
key: "photo_2",
isShowTitle: false
},
{
key: "photo_5",
isShowTitle: false
},
]
})
const tiplists = ref(null)
onLoad((op) => {
details.items = JSON.parse(op.item)
details.id = JSON.parse(op.item).id
// initpage()
})
onShow(() => {
initpage()
getconfig()
})
async function getconfig() {
let res = await dictbizdictionary({ code: 'photo_type' })
console.log('res1>>>>', res);
const { code, data } = res
if (code === 200) {
details.imgList = data.map((value) => {
return {
dictKey: value.dictKey,
dictValue: value.dictValue,
imgList: []
}
})
console.log('details.imgList :>> ', details.imgList);
}
}
function gosetorice(item) {
uni.navigateTo({
url: '/pagesHome/pages/SetPrice/SetPrice?reservationId=' + details.id
+ '&item=' + JSON.stringify(item)
})
}
const signNub = computed(() => {
let num = 0
details.datalist.map(item => {
if (item.signNub) {
num += item.signNub
}
})
return num
})
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)
// })
// }
async function uplodimg(item) {
let data = {
reservationId: item.id,
}
let res = await signforprices(data)
console.log('res>>>>>', res)
let imglis = [], rearks = ''
if (res.code == 200) {
// 有照片或有备注时, 为修改提交状态
if (res.data.deliverySignPictures || res.data.driverRemarks) {
// 提交状态改为修改
details.isChange = true
imglis = res.data.deliverySignPictures
details.imgList.forEach((item, index) => {
if (!imglis[item.dictKey]) return
details.imgList[index].imgList = imglis[item.dictKey]
})
console.log('details.imgList :>> ', details.imgList);
} else {
details.isChange = false
}
if (res.data.driverRemarks) {
rearks = res.data.driverRemarks
}
}
console.log('tiplists :>> ', tiplists.value);
tiplists.value.setdetails({
isshow: true,
tipstate: 3,
placeholder: '请填写备注',
confirmTxt: '确认',
inputtext: rearks,
imglist: details.imgList,
maximglength: 20,
isChange: details.isChange,
changeImageList: details.changeImageList,
ImagesRequiredFields: details.ImagesRequiredFields,
success: async (detail) => {
let data = {
deliveryId: details.id,
reservationId: item.id,
map: {},
driverRemarks: detail.inputtext
}
let res : any = null
// 是否符合提交条件
let isSubmit = true
// 是否为修改提交
if (details.isChange) {
console.log('details.imgList :>> ', details.imgList);
const filterMap = details.imgList.filter(item => details.changeImageList.includes(item.dictKey))
filterMap.forEach(item => {
data.map[item.dictKey] = item.imgList
console.log('object :>> ', details.ImagesRequiredFields.find(val => val === item.dictKey) && item.imgList.length < 3);
if (!details.ImagesRequiredFields.find(val => val === item.dictKey) && item.imgList.length < 3) isSubmit = false;
else isSubmit = true
})
console.log('data :>> ', data);
console.log('isSubmit :>> ', isSubmit);
if (!isSubmit) return
res = await signforUpdatePicture(data)
} else {
details.imgList.forEach(item => {
data.map[item.dictKey] = item.imgList
if (!details.ImagesRequiredFields.find(val => val === item.dictKey) && item.imgList.length < 3) isSubmit = false
else isSubmit = true
})
console.log('details.isChange :>> ', details.isChange);
console.log('isSubmit :>> ', isSubmit);
if (!isSubmit) return
res = await signforsignforack(data)
}
if (res.code == 200) {
initpage()
}
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: 20,
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) {
initpage()
}
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) {
initpage()
}
},
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;
}
}
>.remarks {
color: #747474;
font-size: 28upx;
padding: 20upx 25upx;
box-sizing: border-box;
border-bottom: 3upx solid #EEEEEE;
}
>.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;
}
}
}
.ydk {
color: #9f9f9f !important;
border-color: #9f9f9f !important;
}
.tbck {
display: flex;
flex-direction: column;
padding: 20upx;
>.buts {
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;
}
}
>.mabut {
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;
margin-bottom: 20upx;
&:nth-last-child(1) {
margin-bottom: 0upx;
}
}
}
}
}
}
.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>