<template>
|
<view class="appointment">
|
<view class="searchview">
|
<u-search @change="change" :searchIconSize="40" placeholder="请输入车牌号" height="60" clearabled v-model="carNo" @search="search" @custom="custom" @clear="clear" >
|
</u-search >
|
</view>
|
<u-collapse
|
ref="myCollapse"
|
:value='["1"]'
|
>
|
<u-collapse-item
|
name='1'
|
class="collItem"
|
:title="'待检查司机'">
|
<view style="position: relative;top: -40px;">
|
<u-empty mode="data"
|
icon="http://cdn.uviewui.com/uview/empty/data.png"
|
textSize="30"
|
iconSize="1000"
|
text="暂无车辆"
|
v-if="driverBillOfLoadingData.length == 0"></u-empty>
|
</view>
|
<view class="collection-form">
|
<view class="collection-form-item"
|
v-for="(item, index) in driverBillOfLoadingData"
|
:key="index">
|
<view class="first-line">
|
<view class="dispatch-receive">
|
<view class="dispatch-dept">{{ item.code || '' }}</view>
|
<view class="black-bar"></view>
|
<view class="dispatch">{{ item.customerName ||'' }}</view>
|
</view>
|
<view class="point-number">
|
<text class="order-type">{{ item.productNames?limitString(item.productNames,20,'...'):'' || '' }}</text>
|
</view>
|
</view>
|
<view class="second-line">
|
<view class="coal-name">
|
<view class="dispatch-dept">{{ item.carNo || '' }}</view>
|
<view class="black-bar"></view>
|
<view class="dispatch">{{ item.driver ||'' }}</view>
|
<view class="black-bar"></view>
|
<text>{{ item.phone || '' }}</text>
|
</view>
|
</view>
|
<view class="third-line">
|
<view class="time-icon">
|
<view
|
style="width: 24rpx;height: 24rpx;line-height: 24rpx;background: url('https://wrzs.czjlchem.com:9090/appimg/image/banner/clock.png') no-repeat;background-size: cover">
|
</view>
|
</view>
|
<view class="send-date">{{ item.sendDate }} {{ item.startTime || '' }}-{{item.endTime || ""}}</view>
|
</view>
|
<view class="fourth-line">
|
<view class="receive"
|
v-if="item.roadTransportId"
|
@click.stop="lookRoad(item)">
|
<view class="button-image">剧毒运输证</view>
|
</view>
|
<view class="forward"
|
@click.stop="yuYueBtnClick(item)">
|
<view class="button-image">检查</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</u-collapse-item>
|
</u-collapse>
|
<u-collapse
|
ref="myCollapse"
|
:value='["2"]'
|
>
|
<u-collapse-item
|
name='2'
|
class="collItem"
|
:title="'已检查司机'">
|
<view style="position: relative;top: -40px;">
|
<u-empty mode="data"
|
icon="http://cdn.uviewui.com/uview/empty/data.png"
|
textSize="30"
|
iconSize="1000"
|
text="暂无车辆"
|
v-if="driverBillOfLoadingDatas.length == 0"></u-empty>
|
</view>
|
<view class="collection-form" style="margin-bottom: 60px;">
|
<view class="collection-form-item"
|
v-for="(item, index) in driverBillOfLoadingDatas"
|
:key="index">
|
<view class="first-line">
|
<view class="dispatch-receive">
|
<view class="dispatch-dept">{{ item.code || '' }}</view>
|
<view class="black-bar"></view>
|
<view class="dispatch">{{ item.customerName ||'' }}</view>
|
</view>
|
<view class="point-number">
|
<text class="order-type">{{ item.productNames?limitString(item.productNames,20,'...'):'' || '' }}</text>
|
</view>
|
</view>
|
<view class="second-line">
|
<view class="coal-name">
|
<view class="dispatch-dept">{{ item.carNo || '' }}</view>
|
<view class="black-bar"></view>
|
<view class="dispatch">{{ item.driver ||'' }}</view>
|
<view class="black-bar"></view>
|
<text>{{ item.phone || '' }}</text>
|
</view>
|
</view>
|
<view class="third-line">
|
<view class="time-icon">
|
<view
|
style="width: 24rpx;height: 24rpx;line-height: 24rpx;background: url('https://wrzs.czjlchem.com:9090/appimg/image/banner/clock.png') no-repeat;background-size: cover">
|
</view>
|
</view>
|
<view class="send-date">{{ item.inTime?item.inTime.slice(10,19):null }} </view>
|
</view>
|
<view class="fourth-line">
|
<view class="receive"
|
v-if="item.roadTransportId"
|
@click.stop="lookRoad(item)">
|
<view class="button-image">剧毒运输证</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</u-collapse-item>
|
</u-collapse>
|
<u-popup :show="imgshow"
|
@close="closeimg"
|
@open="openimg"
|
mode="center"
|
round="10">
|
<view class="imgrPopup">
|
<u--image :showLoading="true"
|
:src="certificateImg != null ? BaseUrl + certificateImg : ''"
|
width="100%"
|
height="400rpx"
|
@click="imageClick(certificateImg)">
|
<view slot="error"
|
style="font-size: 24rpx;">加载失败</view>
|
</u--image>
|
<view class="driveruser">
|
<view>司机：{{ysData.driverName}}</view>
|
</view>
|
<view class="driveruser">
|
<view>押运员：{{ysData.supercargoInfo?ysData.supercargoInfo.split("|")[0]:null}}</view>
|
<view>手机号：{{ysData.supercargoInfo?ysData.supercargoInfo.split("|")[2]:null}}</view>
|
</view>
|
</view>
|
</u-popup>
|
<view class="previewImage-container">
|
<u-popup :show="previewImageShow"
|
mode="center"
|
@close="previewImageClose"
|
@open="previewImageOpen">
|
<u--image :src="previewImageSrc != null ? BaseUrl + previewImageSrc : ''"
|
width="750rpx"
|
height="800rpx"></u--image>
|
</u-popup>
|
</view>
|
<u-popup :show="show"
|
@close="close"
|
@open="open"
|
mode="center"
|
round="10">
|
<view class="receiverPopup">
|
<uni-table border
|
stripe
|
type="selection"
|
@selection-change="selectionChange"
|
emptyText="暂无更多数据">
|
<uni-tr>
|
<uni-th align="center">检测项</uni-th>
|
</uni-tr>
|
<uni-tr v-for="(item, index) in inspectData"
|
:key="item.id">
|
<uni-td align="center">{{ item.title }}</uni-td>
|
</uni-tr>
|
</uni-table>
|
<view class="receiverPopup__title"><text>确定检查完毕</text></view>
|
<view class="receiverPopup__btn"><u-button text="确定"
|
type="primary"
|
@click="popClick"
|
:loading="ClickLoading"></u-button></view>
|
</view>
|
</u-popup>
|
<view class="logoutModel">
|
<u-modal :show="logoutShow"
|
:title="logoutTitle"
|
showCancelButton
|
:content="logoutContent"
|
@confirm="logoutConfirm"
|
@cancel="logoutCancel"></u-modal>
|
</view>
|
<view class="falseModel">
|
<u-modal :show="falseShow"
|
:title="logoutTitle"
|
showCancelButton
|
:content="logoutContent"
|
@confirm="falseConfirm"
|
@cancel="falseCancel"></u-modal>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import { BaseUrl } from '@/api/publicInterface.js';
|
import combinedTitle from '@/components/combined-title/combined-title.vue';
|
import previewImage from '@/components/kxj-previewImage/kxj-previewImage.vue';
|
export default {
|
components: {
|
previewImage,
|
},
|
data() {
|
return {
|
show: false, // 弹出全部领取提示
|
driverBillOfLoadingData:[],
|
driverBillOfLoadingDatas:[],
|
inspectData:[],
|
isAllSelected:false,
|
form:{},
|
BaseUrl,
|
carNo:'',
|
previewImageShow:false,
|
imgshow:false,
|
ClickLoading:false,
|
certificateImg:"",
|
logoutShow: false,
|
falseShow:false,
|
logoutTitle: '提示',
|
logoutContent: '是否检查完毕',
|
previewImageSrc:"",
|
ysData:{}
|
}
|
},
|
onShow() {
|
this.init();
|
},
|
methods: {
|
limitString(str, limit, suffix = '...') {
|
if (str.length <= limit) return str;
|
return str.slice(0, limit) + suffix;
|
},
|
falseConfirm(){
|
this.inspectData=[]
|
uni.showLoading({ title: '加载中...' });
|
this.$reqPost('addCheckLog',{
|
carNo:this.form.carNo,
|
taskId:this.form.id,
|
taskcode:this.form.code,
|
}, 'json').then(res => {
|
if (res.code === 0) {
|
uni.$u.toast('检查成功')
|
this.form={}
|
this.ClickLoading = false;
|
this.show = false;
|
this.TaskCoalList()
|
this.falseShow = false;
|
} else {
|
uni.$u.toast(res.msg ? res.msg : '检查失败')
|
this.falseShow = false;
|
}
|
})
|
},
|
logoutConfirm() {
|
if(this.isAllSelected==true){
|
this.ClickLoading = true;
|
this.inspectData=this.inspectData.map(item=>{
|
return {
|
...item,
|
valve:"通过"
|
}
|
})
|
uni.showLoading({ title: '加载中...' });
|
this.$reqPost('addCheckLog',{
|
carNo:this.form.carNo,
|
taskId:this.form.id,
|
taskcode:this.form.code,
|
inspectedResult:JSON.stringify(this.inspectData)
|
}, 'json').then(res => {
|
if (res.code === 0) {
|
uni.$u.toast('检查成功')
|
this.form={}
|
this.ClickLoading = false;
|
this.inspectData=[]
|
this.show = false;
|
this.logoutShow = false;
|
this.TaskCoalList()
|
} else {
|
uni.$u.toast(res.msg ? res.msg : '检查失败')
|
this.logoutShow = false;
|
}
|
})
|
}else{
|
uni.$u.toast('必须全部检测')
|
}
|
},
|
logoutCancel() {
|
this.logoutShow = false;
|
},
|
falseCancel() {
|
this.falseShow = false;
|
},
|
previewImageClose() {
|
this.previewImageShow = false;
|
},
|
previewImageOpen() {},
|
imageClick(data) {
|
this.previewImageSrc = data;
|
this.$nextTick(() => {
|
this.previewImageShow = true;
|
});
|
},
|
lookRoad(item){
|
this.$reqGetId('getById', item.roadTransportId).then(res => {
|
this.certificateImg=res.data.certificateImg
|
this.ysData=res.data
|
this.imgshow=true
|
});
|
},
|
yuYueBtnClick(item){
|
let char = "运输证";
|
if (item.inspectedResult.includes(char)) {
|
if(item.roadTransportId){
|
if(item.inspectedResult){
|
this.inspectData=JSON.parse(item.inspectedResult)
|
this.form=item
|
this.show = true;
|
}else{
|
this.inspectData=[]
|
this.form=item
|
uni.showLoading({ title: '加载中...' });
|
this.$reqPost('addCheckLog',{
|
carNo:this.form.carNo,
|
taskId:this.form.id,
|
taskcode:this.form.code,
|
}, 'json').then(res => {
|
if (res.code === 0) {
|
uni.$u.toast('检查成功')
|
this.form={}
|
this.ClickLoading = false;
|
this.show = false;
|
this.TaskCoalList()
|
} else {
|
uni.$u.toast(res.msg ? res.msg : '检查失败')
|
}
|
})
|
}
|
}else{
|
uni.$u.toast('该司机未上传运输证！')
|
}
|
} else {
|
if(item.inspectedResult){
|
this.inspectData=JSON.parse(item.inspectedResult)
|
this.form=item
|
this.show = true;
|
}else{
|
this.falseShow = true;
|
this.form=item
|
}
|
}
|
|
},
|
selectionChange(items){
|
const allIds = this.inspectData.map(item => item);
|
this.isAllSelected = items?.detail.index.length === allIds.length
|
},
|
init() {
|
this.isAllSelected=false
|
this.TaskCoalList();
|
this.form={}
|
this.inspectData=[]
|
this.certificateImg=""
|
},
|
popClick() {
|
this.logoutShow = true;
|
},
|
open() {},
|
close() {
|
this.show = false;
|
},
|
openimg() {},
|
closeimg() {
|
this.imgshow = false;
|
},
|
// 司机首页列表
|
TaskCoalList() {
|
uni.showLoading({
|
title: '加载中...'
|
});
|
if(!this.carNo){
|
this.$reqGet('getCheckTaskCoal',{flag:0}).then(res => {
|
uni.hideLoading();
|
this.driverBillOfLoadingData = res.data;
|
uni.stopPullDownRefresh();
|
});
|
}else{
|
this.$reqGet('getCheckTaskCoal',{flag:0,carNo:this.carNo}).then(res => {
|
uni.hideLoading();
|
this.driverBillOfLoadingData = res.data;
|
uni.stopPullDownRefresh();
|
});
|
}
|
if(!this.carNo){
|
this.$reqGet('getAlreadyCheckTaskCoal',{flag:0}).then(res => {
|
uni.hideLoading();
|
this.driverBillOfLoadingDatas = res.data;
|
uni.stopPullDownRefresh();
|
});
|
}else{
|
this.$reqGet('getAlreadyCheckTaskCoal',{flag:0,carNo:this.carNo}).then(res => {
|
uni.hideLoading();
|
this.driverBillOfLoadingDatas = res.data;
|
uni.stopPullDownRefresh();
|
});
|
}
|
},
|
change(res) {
|
},
|
search(res) {
|
this.TaskCoalList()
|
},
|
clear(res) {
|
this.carNo=""
|
},
|
custom(res) {
|
}
|
}
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.searchview{
|
margin: 20rpx 0;
|
height: 100rpx;
|
u-search{
|
width: 100rpx;
|
}
|
}
|
.imgrPopup{
|
width: 80vw;
|
background-color: #ffffff;
|
.driveruser{
|
display: flex;
|
justify-content: space-between
|
}
|
}
|
.receiverPopup {
|
height: vww(153);
|
width: 60vw;
|
|
.receiverPopup__title {
|
font-size: 1.4vw;
|
margin: vww(10) auto 0;
|
width: 80%;
|
text-align: center;
|
}
|
|
|
&__btn {
|
margin: vww(10) auto;
|
width: 50%;
|
|
.u-button {
|
height: vww(20);
|
}
|
}
|
}
|
/deep/.u-button {
|
width: 100%;
|
height: 28px !important;
|
line-height: 40px;
|
padding: 0 12px;
|
font-size: 28rpx;
|
font-weight: 300;
|
color: #ffffff;
|
background: #497bfb !important;
|
letter-spacing: 4rpx;
|
border-radius: 37rpx 37rpx 37rpx 37rpx !important;
|
box-shadow: 2rpx 3rpx 13rpx 0rpx rgba(43, 98, 239, 0.5), 0rpx 0rpx 9rpx 0rpx rgba(247, 250, 253, 0.29);
|
}
|
::v-deep.appointment {
|
.appointment-description {
|
margin: vww(8) 0;
|
color: #fd1446;
|
|
text {
|
font-weight: bold;
|
display: inline-block;
|
margin-left: vww(5);
|
color: #252525;
|
}
|
}
|
|
// 表格
|
.uni-table-scroll {
|
width: 100%;
|
overflow-x: hidden;
|
|
.uni-table {
|
min-width: 0 !important;
|
.checkbox {
|
background: #ffffff;
|
}
|
.uni-table-tr {
|
padding: 0;
|
|
.uni-table-th {
|
height: vww(32);
|
line-height: vww(20);
|
padding: vww(5) vww(10);
|
color: #111111;
|
font-size: 2vw;
|
font-weight: 550;
|
background: #ffffff;
|
}
|
|
.uni-table-td {
|
height: vww(32);
|
line-height: vww(20);
|
padding: vww(5) vww(5);
|
font-size: 1.5vw;
|
color: #111111;
|
background: #ffffff;
|
.u-button {
|
height: vww(23);
|
}
|
}
|
}
|
}
|
}
|
}
|
.wait-appointment,
|
.Reserved {
|
position: relative;
|
top: vww(-120);
|
}
|
@mixin flex {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
}
|
.collection-form-item {
|
margin: 0 vww(15);
|
width: 95%;
|
height: 370rpx;
|
background: #ffffff;
|
box-shadow: 4rpx 6rpx 25rpx 0rpx rgba(73, 120, 240, 0.15);
|
border-radius: 20rpx;
|
overflow: hidden;
|
@include flex;
|
flex-direction: column;
|
position: relative;
|
align-items: flex-start;
|
margin-top: vww(10);
|
|
.first-line {
|
width: 94%;
|
height: vww(30);
|
margin: vww(10) vww(16) 0 vww(16);
|
display: flex;
|
justify-content: space-between;
|
|
|
.dispatch-receive {
|
width: 70%;
|
display: flex;
|
justify-content: flex-start;
|
align-items: center;
|
|
.dispatch-dept {
|
|
display: flex;
|
align-items: center;
|
}
|
|
.black-bar {
|
width: 2rpx;
|
height: 30rpx;
|
background: #515151;
|
margin-left: vww(12);
|
}
|
|
.dispatch {
|
margin-left: vww(12);
|
min-width: vww(50);
|
}
|
|
}
|
|
.point-number {
|
width: 33%;
|
.order-type {
|
color: #035cfb;
|
border-radius: 4rpx;
|
text-align: center;
|
}
|
// text {
|
// font-size: 24rpx;
|
// font-weight: 400;
|
// color: #c78a64;
|
// }
|
|
// .residue {
|
// font-size: 40rpx;
|
// font-weight: 400;
|
// color: #f81414;
|
// }
|
}
|
}
|
|
.second-line {
|
width: 100%;
|
height: vww(30);
|
margin-left: vww(16);
|
display: flex;
|
align-items: center;
|
justify-content: flex-start;
|
|
.coal-name {
|
flex-grow: 1;
|
height: 30rpx;
|
font-size: 30rpx;
|
font-weight: 300;
|
color: #515151;
|
position: relative;
|
display: flex;
|
align-items: center;
|
|
.black-bar {
|
width: 2rpx;
|
height: 30rpx;
|
background: #515151;
|
margin: 0 vww(12) ;
|
}
|
|
.coal-type {
|
margin-left: vww(12);
|
min-width: vww(50);
|
height: 30rpx;
|
line-height: 30rpx;
|
font-size: 30rpx;
|
font-weight: 300;
|
color: #515151;
|
}
|
}
|
}
|
|
.third-line {
|
height: vww(30);
|
margin-left: vww(15);
|
display: flex;
|
justify-content: flex-start;
|
align-items: center;
|
|
.send-date {
|
margin-left: vww(14);
|
height: 24rpx;
|
line-height: 24rpx;
|
font-size: 28rpx;
|
font-weight: 300;
|
color: #515151;
|
}
|
}
|
.fourth-line {
|
width: 100%;
|
height: vww(30);
|
@include flex;
|
justify-content: flex-start;
|
position: relative;
|
bottom: vww(10);
|
left: 30%;
|
|
.receive,
|
.forward {
|
width: vww(123);
|
height: vww(48);
|
@include flex;
|
justify-content: center;
|
color: #ffffff;
|
font-size: 28rpx;
|
position: absolute;
|
|
.button-image {
|
width: 100%;
|
height: 100%;
|
background: url('../../../static/image/banner/button.png') no-repeat;
|
background-size: cover;
|
font-size: 28rpx;
|
font-weight: 300;
|
color: #ffffff;
|
text-align: center;
|
line-height: vww(45);
|
}
|
}
|
|
.receive {
|
left: vww(20);
|
}
|
|
.forward {
|
width: vww(106);
|
left: vww(140);
|
|
.button-image {
|
width: 100%;
|
height: 100%;
|
background: url('../../../static/image/banner/transpartent.png') no-repeat;
|
background-size: cover;
|
font-size: 28rpx;
|
font-weight: 300;
|
color: #3b56eb;
|
text-align: center;
|
line-height: vww(45);
|
}
|
}
|
}
|
|
}
|
</style>
|
