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.
324 lines
7.6 KiB
324 lines
7.6 KiB
<template>
|
|
<view class="warp">
|
|
<view class="list_item" v-for="(item,index) in taskList" :key="index">
|
|
<view class="list_item_top" @tap="onTaskInfo(item.id,index)">
|
|
<view class="list_item_lef">
|
|
<block v-if="item.orderSource == 10">
|
|
<image src="/static/images/dispatch/task_lu.png"></image>
|
|
</block>
|
|
<block v-else>
|
|
<image src="/static/images/dispatch/task_bao.png"></image>
|
|
</block>
|
|
<text>{{(item.orderTitle).replace(/\r\n/g, '').replace(/\n/g, '').replace(/\s/g, '').replace(/\t/g, '')}}</text>
|
|
</view>
|
|
<view class="list_item_right">
|
|
<block v-if="item.arriveDate">
|
|
{{item.arriveDate.slice(0,16)}}
|
|
</block>
|
|
</view>
|
|
</view>
|
|
<view class="list_item_car">
|
|
<block v-if="item.vehicleTypeName">
|
|
<view class="l_i_car_lef">[{{item.vehicleTypeName}}]</view>
|
|
</block>
|
|
<block v-if="item.distance != null">
|
|
<view class="l_i_car_rig">{{item.distance}}</view>
|
|
</block>
|
|
</view>
|
|
<view class="list_item_text" @tap="onTaskInfo(item.id,index)">
|
|
<view class="list_item_text_txt">
|
|
<mp-html
|
|
containerStyle="width:100%;height:100%;text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;line-clamp: 3;-webkit-box-orient: vertical;"
|
|
:content="item.orderContent"
|
|
@linktap="linktap"
|
|
/>
|
|
</view>
|
|
</view>
|
|
<view class="list_item_bot">
|
|
<view class="list_item_bot_lef" @tap="onTaskInfo(item.id,index)">
|
|
<block v-if="item.status == 10&&item.address != ''">
|
|
<view class="list_item_bot_lef_10">
|
|
<uni-icons type="location" color="#888888FF" size="22"></uni-icons>
|
|
<text>{{item.address}}</text>
|
|
</view>
|
|
</block>
|
|
<block v-if="item.status != 10">
|
|
<view class="list_item_bot_lef_20">
|
|
<view class="lef_20_lef" @tap.stop="goIndex(item)">{{(item.vehicleCode).substring(0,4)}}</view>
|
|
<view class="lef_20_rig">
|
|
<view class="lef_20_rig_top">{{item.orderVehiclePerson}}</view>
|
|
<view class="lef_20_rig_bot">
|
|
<image src="/static/images/dispatch/taskStatus.png"></image>
|
|
{{item.statusName}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</block>
|
|
</view>
|
|
<block v-if="item.status == 10">
|
|
<view class="list_item_bot_rig" @tap.stop="nowZhipai(item)">
|
|
<image src="/static/images/dispatch/task_top.png"></image>立即指派
|
|
</view>
|
|
</block>
|
|
<block v-if="item.status != 10">
|
|
<view class="list_item_bot_rig" @tap.stop="onCallSiji(item.orderVehicleDriverPhone)">
|
|
<uni-icons type="phone-filled" color="white"></uni-icons>联系司机
|
|
</view>
|
|
</block>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name:"taskItem",
|
|
props:{
|
|
taskList:{
|
|
type:Array,
|
|
default:[]
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
|
|
};
|
|
},
|
|
methods:{
|
|
// 立即指派
|
|
nowZhipai(item){
|
|
uni.setStorage({
|
|
key:'taskInfo',
|
|
data:item,
|
|
success() {
|
|
uni.navigateTo({
|
|
url:'/pages/select-car/select-car'
|
|
})
|
|
}
|
|
})
|
|
},
|
|
// 任务详情
|
|
onTaskInfo(id,index){
|
|
uni.navigateTo({
|
|
url:'/pages/taskInfo/taskInfo?id='+id
|
|
})
|
|
},
|
|
// 查看定位
|
|
goIndex(item){
|
|
let qiPao = {
|
|
'distance':item.distance,
|
|
'expectArriveDate':item.expectArriveDate,
|
|
}
|
|
uni.navigateTo({
|
|
url:"/map/pages/index/index?type=1010&id="+item.vehicleId+"&qiPao="+JSON.stringify(qiPao)
|
|
})
|
|
},
|
|
// /拨打电话
|
|
linktap (e) {
|
|
const tel = e.innerText;
|
|
uni.makePhoneCall({
|
|
phoneNumber: tel
|
|
});
|
|
console.log('linktap 事件触发：', e)
|
|
},
|
|
// 联系司机
|
|
onCallSiji(phone){
|
|
if(phone == ''||phone == null){
|
|
uni.showToast({
|
|
title:'暂无电话号码',
|
|
icon:'none',
|
|
duration:1500
|
|
})
|
|
}else{
|
|
uni.makePhoneCall({
|
|
phoneNumber: phone
|
|
});
|
|
}
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.warp{
|
|
padding-top: 10rpx;
|
|
}
|
|
.list_item{
|
|
width: 710rpx;
|
|
margin: 0 auto;
|
|
border-radius: 16rpx;
|
|
background-color: white;
|
|
margin-bottom: 20rpx;
|
|
// margin-top: 10rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
/* padding: 20rpx 0rpx; */
|
|
.list_item_top{
|
|
// height: 112rpx;
|
|
width: 646rpx;
|
|
margin-top: 25rpx;
|
|
// margin-bottom: 20rpx;
|
|
// border: 1rpx solid red;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
font-size: 28rpx;
|
|
// border-bottom: 1rpx solid #E4E4E4FF;
|
|
.list_item_right{
|
|
width: 250rpx;
|
|
display: flex;
|
|
// border: 1rpx solid red;
|
|
flex-direction: row;
|
|
justify-content: flex-end;
|
|
// color: #4475FD;
|
|
font-size:28rpx;
|
|
// font-weight: bold;
|
|
color:#888888FF;
|
|
}
|
|
.list_item_lef{
|
|
display: flex;
|
|
align-items: center;
|
|
flex-direction: row;
|
|
// border: 1rpx solid red;
|
|
font-weight: bold;
|
|
color: #353535;
|
|
image{
|
|
height: 45rpx;
|
|
width: 45rpx;
|
|
}
|
|
text{
|
|
width: 330rpx;
|
|
overflow: hidden;
|
|
text-overflow:ellipsis ;
|
|
white-space: nowrap;
|
|
margin-left: 10rpx;
|
|
font-weight: bold;
|
|
font-size:32rpx ;
|
|
lines: 1;
|
|
// display: flex;
|
|
// flex-direction: row;
|
|
// flex-wrap: nowrap;
|
|
}
|
|
}
|
|
}
|
|
.list_item_car{
|
|
width: 646rpx;
|
|
margin-top:8rpx;
|
|
margin-bottom: 20rpx;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
font-size: 26rpx;
|
|
color:#888888FF;
|
|
.l_i_car_lef{
|
|
margin-left: 55rpx;
|
|
}
|
|
}
|
|
.list_item_text{
|
|
width: 646rpx;
|
|
// padding: 0rpx 0rpx 10rpx 0rpx;
|
|
// border: 1rpx solid red;
|
|
.list_item_text_txt{
|
|
width: 100%;
|
|
height: 120rpx;
|
|
overflow: hidden;
|
|
// font-family:SimSun ;
|
|
font-size:28rpx;
|
|
line-height: 40rpx;
|
|
color: #555555;
|
|
}
|
|
}
|
|
.list_item_bot{
|
|
height: 104rpx;
|
|
width: 646rpx;
|
|
// border: 1rpx solid red;
|
|
display: flex;
|
|
margin-top: 25rpx;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
border-top: 1rpx solid #E4E4E4FF;
|
|
.list_item_bot_lef{
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
color:#7c7c7cff;
|
|
font-size:26rpx;
|
|
.list_item_bot_lef_10{
|
|
display: flex;
|
|
align-items: center;
|
|
flex-direction: row;
|
|
text{
|
|
width: 350rpx;
|
|
// border: 1rpx solid red;
|
|
overflow: hidden;
|
|
text-overflow:ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
}
|
|
.list_item_bot_lef_20{
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
.lef_20_lef{
|
|
width:80rpx;
|
|
height: 80rpx;
|
|
border-radius: 50%;
|
|
font-size: 25rpx;
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
align-items: center;
|
|
justify-content: center;
|
|
overflow: hidden;
|
|
// border: 1rpx solid red;
|
|
background-color: #4576EE;
|
|
color: white;
|
|
}
|
|
.lef_20_rig{
|
|
display: flex;
|
|
flex-direction: column;
|
|
margin-left: 10rpx;
|
|
.lef_20_rig_top{
|
|
color: #353535;
|
|
}
|
|
.lef_20_rig_bot{
|
|
width: 120rpx;
|
|
margin-top: 5rpx;
|
|
overflow: hidden;
|
|
border: 2rpx solid #4576EE;
|
|
border-radius: 10rpx;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
color: #4576EE;
|
|
image{
|
|
height: 35rpx;
|
|
width: 35rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.list_item_bot_rig{
|
|
height:62rpx;
|
|
width: 170rpx;
|
|
border-radius: 31rpx;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 23rpx;
|
|
background-color: #3476FEFF;
|
|
color: #FFFFFFFF;
|
|
image{
|
|
width: 21rpx;
|
|
height: 25rpx;
|
|
margin-right:8rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|
|
|