<template>
|
<div
|
class="warp"
|
:style="{
|
backgroundImage: `url(${onlineurl}/appimg/image/banner/diverbanner.png)`,
|
backgroundSize: 'contain',
|
backgroundRepeat: 'no-repeat',
|
}"
|
>
|
<div class="warp-box">
|
<!-- 当前的订单 -->
|
<!-- 占位 -->
|
<!-- 修改样式容器包裹首页 -->
|
<view class="indexPageDiv">
|
<div class="ingOrderDiv">
|
<div
|
class="ingOrder"
|
v-for="(item, i) in (driverBillOfLoadingData.list2 )"
|
:key="i"
|
v-if="i == 0"
|
@click="list3CardIconClick(item)"
|
>
|
<!-- 第一行 -->
|
<div class="firstLine">
|
<div class="leftIcon">
|
<div class="leftOneDiv">
|
<span class="leftOne">装</span>
|
</div>
|
<div class="leftLine"></div>
|
<div class="rightDiv">
|
<span class="rightone">卸</span>
|
</div>
|
</div>
|
<div class="centerTitle">
|
<view class="filedname exceedHide">
|
<text
|
v-if="item.orderType == '外销' || item.orderType == '内销'"
|
>{{ item.deptName }}</text
|
>
|
<text
|
v-else-if="
|
item.orderType == '外购' || item.orderType == '内购'
|
"
|
>{{ item.customerName }}</text
|
>
|
<text
|
v-else-if="
|
item.orderType == '转出' || item.orderType == '转入'
|
"
|
>
|
{{ item.filedName }}
|
</text>
|
</view>
|
<p class="centerLine"></p>
|
<view class="filedname exceedHide">
|
<text
|
v-if="item.orderType == '外销' || item.orderType == '内销'"
|
>{{ item.customerName }}</text
|
>
|
<text
|
v-else-if="
|
item.orderType == '外购' || item.orderType == '内购'
|
"
|
>{{ item.deptName }}</text
|
>
|
<text
|
v-else-if="
|
item.orderType == '转出' || item.orderType == '转入'
|
"
|
>
|
{{ item.toFiledName }}
|
</text>
|
</view>
|
</div>
|
<div class="rightIcon">
|
<u-icon
|
name="map"
|
color="#4978F0"
|
@click.stop="skipMap(item)"
|
size="40"
|
></u-icon>
|
<u-icon
|
@click.stop="skipMap(item)"
|
name="map"
|
color="#4978F0"
|
size="40"
|
></u-icon>
|
</div>
|
</div>
|
<div class="statusBox">
|
<div class="twoleft">
|
<view class="time-icon"
|
><u-icon name="clock" color="#515151" size="25"></u-icon
|
></view>
|
<view
|
class="send-date"
|
style="font-size: 13px; color: #1f4978f0"
|
>{{ item.yuYueSection || item.yuYueTime }}</view
|
>
|
</div>
|
<view class="status">
|
<u-tag :text="coalStatus[item.statusWeigh] || ''" plain>
|
</u-tag>
|
</view>
|
</div>
|
|
<div class="twoLine">
|
<div class="twoRight">
|
<view>
|
<u-tag :text="item.coalName" plain> </u-tag>
|
</view>
|
<view style="margin-left: 10rpx">
|
<u-tag :text="item.orderType" plain> </u-tag>
|
</view>
|
</div>
|
</div>
|
<div class="threeLine">
|
<span class="more" @click="todoHistory">更多>></span>
|
</div>
|
</div>
|
</div>
|
|
<!-- 九宫格 -->
|
<view class="gridBoxBg no-right no-left">
|
<view class="gridBox">
|
<u-grid :border="false" col="4" v-if="!loading">
|
<u-grid-item
|
v-for="(listItem, listIndex) in list"
|
:key="listIndex"
|
>
|
<u--image
|
:showLoading="true"
|
:src="listItem.src"
|
width="50px"
|
height="50px"
|
@click="gridClick(listItem)"
|
></u--image>
|
<text class="grid-text">{{ listItem.title }}</text>
|
</u-grid-item>
|
</u-grid>
|
</view>
|
</view>
|
|
<!-- 立即抢单 -->
|
<div
|
class="orderGrabbing"
|
v-for="(item, i) in driverBillOfLoadingData.list1"
|
:key="i"
|
>
|
<!-- 第一行 -->
|
<div class="firstLine">
|
<div class="leftIcon">
|
<div class="leftOneDiv">
|
<span class="leftOne">装</span>
|
</div>
|
<div class="leftLine"></div>
|
<div class="rightDiv">
|
<span class="rightone">卸</span>
|
</div>
|
</div>
|
<div class="centerTitle">
|
<view class="filedname exceedHide">
|
<text
|
v-if="item.orderType == '外销' || item.orderType == '内销'"
|
>{{ item.deptName || "" }}</text
|
>
|
<text
|
v-else-if="
|
item.orderType == '外购' || item.orderType == '内购'
|
"
|
>{{
|
item.customerId
|
? item.customerName
|
: item.customerNameCopy || ""
|
}}</text
|
>
|
<text
|
v-else-if="
|
item.orderType == '转出' || item.orderType == '转入'
|
"
|
>{{ item.filedName }}
|
</text>
|
</view>
|
<p class="centerLine"></p>
|
<view class="filedname exceedHide">
|
<text
|
v-if="item.orderType == '外销' || item.orderType == '内销'"
|
>
|
{{
|
item.customerNameCopy
|
? item.customerNameCopy
|
: item.customerName || ""
|
}}
|
</text>
|
<text
|
v-else-if="
|
item.orderType == '外购' || item.orderType == '内购'
|
"
|
>{{ item.deptName || "" }}</text
|
>
|
<text
|
v-else-if="
|
item.orderType == '转出' || item.orderType == '转入'
|
"
|
>{{ item.toFiledName }}
|
</text>
|
</view>
|
</div>
|
<div class="rightIcon">
|
<div>
|
<span
|
style="color: #f81414; font-size: 40rpx; font-weight: 400"
|
>{{ item.carNum - item.taskNum }}</span
|
>
|
<span style="font-size: 24rpx; color: #c78a64; font-weight: 400"
|
>/</span
|
>
|
<span
|
style="font-size: 24rpx; color: #c78a64; font-weight: 400"
|
>{{ item.carNum }}</span
|
>
|
</div>
|
</div>
|
</div>
|
<div class="twoLine">
|
<div class="twoleft">
|
<span>{{ item.coalName }}</span>
|
<span>|</span>
|
<span>{{ item.orderType }}</span>
|
</div>
|
</div>
|
<div class="threeLine">
|
<div class="date">
|
<view class="time-icon"
|
><u-icon name="clock" color="#515151" size="30"></u-icon
|
></view>
|
<view class="send-date">{{ item.createTime }}</view>
|
</div>
|
<span class="more">
|
<div @click.stop="qiangDanBtn(item)" class="qiangdanBtn">
|
立即抢单
|
</div>
|
</span>
|
</div>
|
</div>
|
<!-- 待预约提煤单 -->
|
<combined-title title="待预约通知单"></combined-title>
|
<div
|
class="pendingAppointment"
|
v-for="(item, i) in driverBillOfLoadingData.list3"
|
:key="i"
|
@click.stop="list3CardIconClick(item)"
|
>
|
<div class="firstLine">
|
<div class="leftIcon">
|
<div class="leftOneDiv">
|
<span class="leftOne">装</span>
|
</div>
|
<div class="leftLine"></div>
|
<div class="rightDiv">
|
<span class="rightone">卸</span>
|
</div>
|
</div>
|
<div class="centerTitle">
|
<view class="filedname exceedHide">
|
<text
|
v-if="item.orderType == '外销' || item.orderType == '内销'"
|
>{{ item.deptName || "" }}</text
|
>
|
<text
|
v-else-if="
|
item.orderType == '外购' || item.orderType == '内购'
|
"
|
>{{
|
item.customerId
|
? item.customerName
|
: item.customerNameCopy || ""
|
}}</text
|
>
|
<text
|
v-else-if="
|
item.orderType == '转出' || item.orderType == '转入'
|
"
|
>{{ item.filedName }}
|
</text>
|
</view>
|
<p class="centerLine"></p>
|
<view class="filedname exceedHide">
|
<text
|
v-if="item.orderType == '外销' || item.orderType == '内销'"
|
>
|
{{
|
item.customerNameCopy
|
? item.customerNameCopy
|
: item.customerName || ""
|
}}
|
</text>
|
<text
|
v-else-if="
|
item.orderType == '外购' || item.orderType == '内购'
|
"
|
>{{ item.deptName || "" }}</text
|
>
|
<text
|
v-else-if="
|
item.orderType == '转出' || item.orderType == '转入'
|
"
|
>{{ item.toFiledName }}
|
</text>
|
</view>
|
</div>
|
<div class="rightIcon">
|
<!-- <div>
|
<span style="color: #F81414;font-size: 40rpx;font-weight: 400">3</span>
|
<span style="font-size: 24rpx;color: #C78A64;font-weight: 400;">/</span>
|
<span style="font-size: 24rpx;color: #C78A64;font-weight: 400;">18</span>
|
</div> -->
|
</div>
|
</div>
|
<div class="twoLine">
|
<div class="twoleft">
|
<span>{{ item.coalName }}</span>
|
<span>|</span>
|
<span>{{ item.orderType }}</span>
|
</div>
|
</div>
|
<div class="threeLine">
|
<div class="date">
|
<view class="time-icon"
|
><u-icon name="clock" color="#515151" size="30"></u-icon
|
></view>
|
<view class="send-date"> {{ item.createTime }}</view>
|
</div>
|
<span class="more">
|
<div class="qiangdanBtn" @click.stop="toAppointmentClick(item)">
|
立即预约
|
</div>
|
</span>
|
</div>
|
</div>
|
<!-- <div v-if="!driverBillOfLoadingData.list3.length"><u-empty
|
mode="data"
|
icon="http://cdn.uviewui.com/uview/empty/data.png"
|
textSize="30"></u-empty></div> -->
|
<!-- 通知通告 -->
|
<combined-title title="通知公告"></combined-title>
|
<div class="tongzhi">
|
<u-list
|
style="height:auto"
|
v-if="noticeList && noticeList.length"
|
height='540'
|
scrollable='false'
|
>
|
<u-list-item v-for="(item, index) in noticeList" :key="index">
|
<div class="listItem" @click="todoNotice(item)">
|
<div class="listItemTop">
|
<u-avatar
|
slot="icon"
|
shape="square"
|
size="35"
|
:src="item.url"
|
customStyle="margin: -3px 5px -3px 0"
|
></u-avatar>
|
<div v-html="item.title"></div>
|
</div>
|
|
<span class="listDate">{{ item.createTime }}</span>
|
</div>
|
</u-list-item>
|
</u-list>
|
<u-empty
|
v-if="!noticeList.length"
|
mode="data"
|
icon="http://cdn.uviewui.com/uview/empty/data.png"
|
textSize="30"
|
></u-empty>
|
</div>
|
<!-- 引导页 -->
|
<view class="noob-tour" v-if="roleType === 3 && isFirstLogin">
|
<!-- <combined-title title="操作指引"></combined-title> -->
|
<u-cell-group>
|
<u-cell
|
title="新手指引"
|
name="1"
|
:clickable="true"
|
@click="noobTour"
|
>
|
<u-badge type="primary" value="01" slot="icon"></u-badge>
|
<u-icon
|
slot="value"
|
name="arrow-right"
|
size="30"
|
color="#b8b8b8"
|
></u-icon>
|
</u-cell>
|
</u-cell-group>
|
</view>
|
</view>
|
</div>
|
<!-- 抢单提示模态框 -->
|
<view class="qianDanModel">
|
<u-modal
|
:show="qiangDanShow"
|
:title="qiangDanTitle"
|
showCancelButton
|
:content="qiangDanContent"
|
@confirm="qiangDanConfirm"
|
@cancel="qiangDanCancel"
|
></u-modal>
|
</view>
|
<!-- 图片预览弹出框 -->
|
<view class="previewImage-container">
|
<previewImage
|
ref="previewImage"
|
:imgs="driverTourImgList"
|
:saveBtn="false"
|
></previewImage>
|
</view>
|
<!-- 通知公告 -->
|
<u-modal
|
:show="noticeModelShow"
|
:title="notice.title"
|
@confirm="noticConfirm"
|
>
|
<div v-html="notice.content"></div>
|
</u-modal>
|
<!-- 外销抢单选择车牌 -->
|
<u-modal :show="show"
|
showCancelButton
|
@confirm="showConFirm(activeObj)"
|
@cancel="showCancel"
|
:title="title" >
|
<view class="slot-content">
|
<view style="text-align: left;">
|
<u-radio-group
|
v-model="paramsCarNo"
|
placement="column"
|
>
|
<u-radio
|
:iconSize="40"
|
:labelSize="40"
|
:size="40"
|
:customStyle="{marginBottom: '8px'}"
|
v-for="(item, index) in paramsArr"
|
:key="index"
|
:label="item.carNo + '--' + item.name"
|
:name="item.carNo"
|
@change="radioChange"
|
>
|
</u-radio>
|
|
|
</u-radio-group>
|
</view>
|
</view>
|
</u-modal>
|
</div>
|
</template>
|
<script>
|
import { onlineurl } from "@/api/request.js";
|
import { BaseUrl } from "@/api/publicInterface.js";
|
import combinedTitle from "@/components/combined-title/combined-title.vue";
|
import previewImage from "@/components/kxj-previewImage/kxj-previewImage.vue";
|
import { mapState } from "vuex";
|
import { Debounce } from "../../../utils/util";
|
export default {
|
components: {
|
combinedTitle,
|
previewImage,
|
},
|
props: {
|
indexdriverBillOfLoadingData: {
|
type: Object,
|
default: {},
|
},
|
},
|
watch: {
|
indexdriverBillOfLoadingData: {
|
handler(v) {
|
this.driverBillOfLoadingData = v;
|
},
|
deep: true,
|
immediate: true,
|
},
|
},
|
computed: {
|
...mapState(["driverTourImgList"]),
|
roleType() {
|
return uni.getStorageSync("roleType");
|
},
|
},
|
data() {
|
return {
|
labaIcon: `${onlineurl}/appimg/image/aboutUs/laba.jpg`,
|
newIcon: `${onlineurl}/appimg/image/aboutUs/labaHeight.jpg`,
|
markFlag: "none",
|
activeObj:{},
|
noticeModelShow: false,
|
garidInitTop: "", //元素初始距离顶部的高度
|
screenHeight: "",
|
show:false,
|
paramsArr:[],
|
paramsCarNo:'',
|
title:'选择车牌',
|
notice: {
|
title: "",
|
content: "",
|
},
|
noticeList: [],
|
urls: [
|
"https://cdn.uviewui.com/uview/album/1.jpg",
|
"https://cdn.uviewui.com/uview/album/2.jpg",
|
"https://cdn.uviewui.com/uview/album/3.jpg",
|
"https://cdn.uviewui.com/uview/album/4.jpg",
|
"https://cdn.uviewui.com/uview/album/5.jpg",
|
"https://cdn.uviewui.com/uview/album/6.jpg",
|
"https://cdn.uviewui.com/uview/album/7.jpg",
|
"https://cdn.uviewui.com/uview/album/8.jpg",
|
"https://cdn.uviewui.com/uview/album/9.jpg",
|
"https://cdn.uviewui.com/uview/album/10.jpg",
|
],
|
list: [
|
{
|
src: "/static/image/无人值守/司机端首页/组 15.jpg",
|
title: "合作基地",
|
},
|
{
|
src: "/static/image/无人值守/司机端首页/组 15(1).jpg",
|
title: "历史订单",
|
},
|
// {
|
// src: '/static/image/无人值守/司机端首页/组 15(2).jpg',
|
// title: '质检'
|
// },
|
// {
|
// src: '/static/image/无人值守/司机端首页/组 15(3).jpg',
|
// title: '车队管理'
|
// },
|
{
|
src: "/static/image/无人值守/司机端首页/组 15(4).jpg",
|
title: "关于我们",
|
},
|
{
|
src: "/static/image/无人值守/司机端首页/组 14.jpg",
|
title: "消息",
|
},
|
{
|
src: "/static/image/无人值守/司机端首页/组 32.jpg",
|
title: "操作指南",
|
},
|
{
|
src: "/static/image/无人值守/司机端首页/组 15(5).jpg",
|
title: "数据统计",
|
},
|
],
|
driverBillOfLoadingData: {
|
list1: [],
|
list2: [],
|
list3: [],
|
},
|
// 抢单模态框
|
qiangDanShow: false,
|
noticePage: {
|
current: 1,
|
page: 5,
|
size:5,
|
},
|
|
qiangDanTitle: "抢单提示",
|
qiangDanContent: "",
|
qiangDanOrderPlanId: null,
|
fleetId: "",
|
xsUserId: "",
|
customerId: "",
|
coalStatus: ["未称重", "称重中", "验质中", "称重完成", "处理完成"],
|
onlineurl,
|
phone: "",
|
loading: true,
|
isFirstLogin: true, //是否是第一次登录
|
};
|
},
|
mounted() {
|
// this.TourImgList = TourImgList
|
this.getLogOn();
|
this.getNoticeList();
|
this.watchScrollFun();
|
},
|
onShow() {
|
this.init();
|
},
|
methods: {
|
// 跳转地图
|
skipMap(val) {
|
uni.navigateTo({
|
url: `/pages/public-page/mapRoute/mapRoute?customerId=${
|
val.customerId
|
}&filedId=${val.filedId}&orderType=${val.orderType}${
|
val.toFiledId
|
? `&toFiledId=${val.toFiledId}&filedId=${val.filedId}`
|
: ""
|
}`,
|
});
|
},
|
gridClick(item) {
|
console.log(item, "1231");
|
switch (item.title) {
|
case "关于我们":
|
uni.navigateTo({
|
url: `/pages/public-page/aboutus/index`,
|
});
|
break;
|
|
case "数据统计":
|
uni.navigateTo({
|
url: `/pages/public-page/dataStatistics/index`,
|
});
|
break;
|
|
case "历史订单":
|
uni.navigateTo({
|
url: `/pages/public-page/historicalOrders/index?historyData=${JSON.stringify(
|
this.driverBillOfLoadingData.list2
|
)}`,
|
});
|
break;
|
|
case "操作指南":
|
this.noobTour();
|
break;
|
case "消息":
|
uni.navigateTo({
|
url: "/pages/public-page/message/message",
|
});
|
break;
|
|
case "合作基地":
|
uni.navigateTo({
|
url: "/pages/public-page/cooperationBase/index",
|
});
|
break;
|
|
default:
|
break;
|
}
|
},
|
onScroll(e) {
|
// 监听页面向上滚动事件
|
// let query = uni.createSelectorQuery().in(this);
|
// query.select('.gridBox').boundingClientRect(data => {
|
// if(this.garidInitTop && (this.garidInitTop > data.top)){
|
// // console.log(data,data.top, query.select('.mark'));
|
// this.$nextTick(() => {
|
// this.markFlag = 'block'; //显示
|
// });
|
// }else{
|
// this.$nextTick(() => {
|
// this.markFlag = 'none'; //隐藏
|
// });
|
// }
|
// }).exec();
|
},
|
init() {
|
this.qiangDanList();
|
},
|
scrolltolower() {
|
this.loadmore();
|
},
|
loadmore() {
|
this.noticePage.current++;
|
this.getNoticeList();
|
},
|
watchScrollFun() {
|
//初始化获取屏幕高度
|
const res = uni.getSystemInfoSync();
|
let query = uni.createSelectorQuery().in(this);
|
query
|
.select(".gridBox")
|
.boundingClientRect((data) => {
|
this.garidInitTop = data.top;
|
})
|
.exec();
|
this.screenHeight = res.screenHeight;
|
},
|
getNoticeList() {
|
this.$reqGet("noticeList", { ...this.noticePage, isNotice: "1" }).then(
|
(res) => {
|
console.log(res, "resresres");
|
if (res.code == 0) {
|
let result = res.data.records;
|
if (result.length) {
|
this.noticeList = this.noticeList.concat(result);
|
} else {
|
//否则就是空
|
}
|
|
let arr = this.noticeList.sort((a, b) => {
|
return new Date(a) - new Date(b);
|
});
|
console.log(arr);
|
this.noticeList = arr.map((item, i) => {
|
if (i == 0) {
|
item.url = this.newIcon;
|
} else {
|
item.url = this.labaIcon;
|
}
|
return item;
|
});
|
}
|
}
|
);
|
},
|
// 司机首页列表
|
qiangDanList() {
|
uni.showLoading({
|
title: "加载中...",
|
});
|
this.$reqGet("qiangDanList")
|
.then((res) => {
|
uni.hideLoading();
|
this.driverBillOfLoadingData = res.data;
|
this.loading = false;
|
})
|
.finally(() => {
|
this.loading = false;
|
});
|
},
|
// 抢单按钮
|
qiangDanBtn: Debounce(function (value) {
|
console.log(value,'value')
|
this.activeObj = value;
|
if(value.orderType === '外销'){
|
this.$reqPost('getCarNosByFleetId',{fleetId:value.fleetId},'params').then(res=>{
|
console.log(res,'ress')
|
this.paramsArr = res.data;
|
this.show = true;
|
// if (value.tmcCount == "0") {
|
// this.qiangDan(
|
// value.orderPlanId,
|
// value.fleetId,
|
// value.customerId === null ? "0" : value.customerId,
|
// value.xsUserId === null ? "0" : value.xsUserId
|
// );
|
// } else {
|
// this.qiangDanOrderPlanId = value.orderPlanId;
|
// this.fleetId = value.fleetId;
|
// this.customerId = value.customerId === null ? "0" : value.customerId;
|
// this.xsUserId = value.xsUserId === null ? "0" : value.xsUserId;
|
// this.qiangDanShow = true;
|
// this.qiangDanContent = `已抢${value.tmcCount}单，确定抢单？`;
|
// }
|
})
|
}else{
|
if (value.tmcCount == "0") {
|
this.qiangDan(
|
value.orderPlanId,
|
value.fleetId,
|
value.customerId === null ? "0" : value.customerId,
|
value.xsUserId === null ? "0" : value.xsUserId
|
);
|
} else {
|
this.qiangDanOrderPlanId = value.orderPlanId;
|
this.fleetId = value.fleetId;
|
this.customerId = value.customerId === null ? "0" : value.customerId;
|
this.xsUserId = value.xsUserId === null ? "0" : value.xsUserId;
|
this.qiangDanShow = true;
|
this.qiangDanContent = `已抢${value.tmcCount}单，确定抢单？`;
|
}
|
}
|
|
|
}, 500),
|
showConFirm(value){
|
if (value.tmcCount == "0") {
|
this.qiangDan(
|
value.orderPlanId,
|
value.fleetId,
|
value.customerId === null ? "0" : value.customerId,
|
value.xsUserId === null ? "0" : value.xsUserId
|
);
|
} else {
|
this.qiangDanOrderPlanId = value.orderPlanId;
|
this.fleetId = value.fleetId;
|
this.customerId = value.customerId === null ? "0" : value.customerId;
|
this.xsUserId = value.xsUserId === null ? "0" : value.xsUserId;
|
this.qiangDanShow = true;
|
this.qiangDanContent = `已抢${value.tmcCount}单，确定抢单？`;
|
}
|
this.show =false;
|
|
},
|
showCancel(){
|
this.show = false;
|
|
},
|
|
// 抢单模态框
|
qiangDanConfirm() {
|
this.qiangDanContent = "";
|
this.qiangDanShow = false;
|
this.qiangDan(
|
this.qiangDanOrderPlanId,
|
this.fleetId,
|
this.customerId,
|
this.xsUserId
|
);
|
},
|
qiangDanCancel() {
|
this.qiangDanShow = false;
|
},
|
// 抢单请求
|
qiangDan(id, fleetId, customerId, xsUserId) {
|
console.log(this.paramsCarNo,'paramsCarNo')
|
this.$reqPost(
|
"qiangDan",
|
{
|
orderPlanId: id,
|
fleetId: fleetId,
|
customerId: customerId,
|
xsUserId: xsUserId,
|
carNo:this.paramsCarNo ? this.paramsCarNo : '',
|
},
|
"params"
|
)
|
.then((res) => {
|
if (res.code == 0) {
|
this.paramsCarNo = '';
|
this.$u.toast("抢单成功");
|
} else {
|
this.$u.toast(res.msg ? res.msg : "抢单失败");
|
}
|
})
|
.then(() => {
|
setTimeout(() => {
|
this.qiangDanList();
|
}, 1000);
|
});
|
},
|
list3CardIconClick(value) {
|
uni.navigateTo({
|
url: `/pages/driver-page/driver-index/bill-of-lading-details/bill-of-lading-details?orderPlanId=${value.id}&yyId=${value.yyId}`,
|
});
|
},
|
// 通知单详情
|
cardBodyClick(name) {
|
uni.navigateTo({
|
url: `/pages/driver-page/driver-index/bill-of-lading-details/bill-of-lading-details?orderPlanId=${name}`,
|
});
|
},
|
// 去预约
|
toAppointmentClick(value) {
|
uni.navigateTo({
|
url: `/pages/driver-page/appointment/appointment?takeCoalId=${value.id}&filedId=${value.filedId}&deptId=${value.deptId}&sendDate=${value.sendDate}`,
|
});
|
},
|
noobTour() {
|
this.$refs.previewImage.open(
|
"https://mx.jzeg.cn:9095/appimg/image/tour/driver/sj1.jpg"
|
);
|
},
|
getLogOn() {
|
this.$reqGet("getUserEntity")
|
.then((res) => {
|
this.phone = res.data.phone;
|
})
|
.then(() => {
|
uni.request({
|
url: `${BaseUrl}/admin/log/getLogOnType?phone=${this.phone}`,
|
success: (res) => {
|
// res.data.data 为1 代表第一次登录 为0取消学习指引 为2 代表存在
|
if (res.data.data === 1) {
|
this.noobTour();
|
} else if (res.data.data === 2) {
|
this.isFirstLogin = true;
|
} else {
|
this.isFirstLogin = false;
|
}
|
},
|
});
|
});
|
},
|
todoHistory() {
|
uni.navigateTo({
|
url: `/pages/public-page/historicalOrders/index?historyData=${JSON.stringify(
|
this.driverBillOfLoadingData.list2
|
)}`,
|
});
|
},
|
todoNotice(item) {
|
console.log(item, "item");
|
if (item) {
|
this.noticeModelShow = true;
|
this.notice = item;
|
}
|
},
|
noticConfirm() {
|
this.noticeModelShow = false;
|
},
|
},
|
};
|
</script>
|
<style lang="scss" scoped>
|
.indexPageDiv{
|
width: 100%;
|
position: absolute;
|
height: calc(100vh - 100rpx);
|
top: 280rpx;
|
left: 0;
|
}
|
.warp {
|
.page {
|
z-index: 999;
|
}
|
width: 100%;
|
height: 100%;
|
display: flex;
|
margin: 0 auto;
|
flex: 1;
|
flex-direction: column;
|
padding-top: calc(var(--window-top) + 20px);
|
background-position: 0rpx 0rpx;
|
background-size: 100% 600rpx;
|
.warp-box {
|
width: 100%;
|
height: calc(100vh - 73px);
|
// z-index: 9;
|
display: flex;
|
position: relative;
|
flex-direction: column;
|
// overflow-y: auto;
|
margin: 0 auto;
|
background-color: unset;
|
// padding-bottom: 100rpx;
|
|
.ingOrderDiv {
|
width: 100%;
|
// min-height: 630rpx;
|
margin: 0 auto;
|
}
|
.ingOrder {
|
width: 94%;
|
height: 370rpx;
|
margin: 0 auto;
|
background: #ffffff;
|
box-shadow: 0rpx 0rpx 14rpx 0rpx rgba(73, 120, 240, 0.14),
|
0rpx 7rpx 45rpx 0rpx rgba(73, 120, 240, 0.12);
|
border-radius: 20rpx;
|
display: flex;
|
flex-direction: column;
|
padding-top: 20rpx;
|
.statusBox {
|
width: 94%;
|
margin: 0 auto;
|
margin-top: 20rpx;
|
display: flex;
|
justify-content: space-between;
|
.twoleft {
|
display: flex;
|
justify-items: center;
|
align-items: center;
|
.time-icon {
|
margin-right: 10rpx;
|
display: flex;
|
align-items: center;
|
}
|
}
|
}
|
.status {
|
display: flex;
|
width: 150rpx;
|
}
|
|
.firstLine {
|
flex: 0 1 60%;
|
width: 92%;
|
margin: 0 auto;
|
display: flex;
|
justify-content: space-between;
|
.rightIcon {
|
display: flex;
|
height: 150rpx;
|
flex-direction: column;
|
justify-content: space-between;
|
}
|
.leftIcon {
|
display: flex;
|
height: 150rpx;
|
flex-direction: column;
|
justify-content: space-between;
|
.leftOneDiv {
|
width: 46rpx;
|
height: 46rpx;
|
background: #035cfb;
|
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(255, 255, 255, 0.85);
|
border-radius: 5rpx;
|
text-align: center;
|
.leftOne {
|
width: 31rpx;
|
height: 31rpx;
|
font-size: 30rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 400;
|
color: #ffffff;
|
}
|
}
|
.rightDiv {
|
width: 46rpx;
|
height: 46rpx;
|
background: #f1333c;
|
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(255, 255, 255, 0.85);
|
border-radius: 5rpx;
|
text-align: center;
|
.rightone {
|
width: 29rpx;
|
height: 31rpx;
|
font-size: 30rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 400;
|
color: #ffffff;
|
}
|
}
|
.leftLine {
|
width: 2rpx;
|
height: 43rpx;
|
border-right: 2px dotted #303030;
|
transform: translateX(15rpx);
|
}
|
}
|
}
|
.centerTitle {
|
display: flex;
|
flex-direction: column;
|
justify-content: space-between;
|
|
height: 150rpx;
|
.centerLine {
|
width: 510rpx;
|
height: 1rpx;
|
border-bottom: solid 1px #ccc;
|
}
|
}
|
|
.twoLine {
|
flex: 0 1 25%;
|
width: 92%;
|
margin: 20rpx auto;
|
display: flex;
|
justify-content: space-between;
|
.twoleft {
|
display: flex;
|
justify-content: space-around;
|
align-items: center;
|
.send-date {
|
font-size: 25rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 300;
|
color: #515151;
|
}
|
span {
|
color: #515151;
|
font-size: 30rpx;
|
font-weight: 300;
|
}
|
}
|
.twoRight {
|
display: flex;
|
justify-content: space-around;
|
}
|
}
|
.threeLine {
|
flex: 0 1 25%;
|
display: flex;
|
justify-content: flex-end;
|
height: 100rpx;
|
.more {
|
width: 106rpx;
|
height: 20rpx;
|
font-size: 24rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 300;
|
color: #494949;
|
margin-right: 20rpx;
|
}
|
}
|
}
|
.gridBox {
|
width: 100%;
|
height: 270rpx;
|
margin: 0 auto;
|
margin-top: 30rpx;
|
margin-bottom: 30rpx;
|
.grid-text {
|
font-size: 28rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 300;
|
color: #494949;
|
}
|
}
|
.orderGrabbing {
|
width: 690rpx;
|
height: 351rpx;
|
background: #ffffff;
|
box-shadow: 4rpx 6rpx 25rpx 0rpx rgba(73, 120, 240, 0.15);
|
border-radius: 20rpx;
|
margin: 30rpx auto;
|
padding-top: 20rpx;
|
.firstLine {
|
flex: 0 1 60%;
|
width: 92%;
|
margin: 0 auto;
|
display: flex;
|
.rightIcon {
|
display: flex;
|
height: 150rpx;
|
flex-direction: column;
|
justify-content: space-between;
|
position: absolute;
|
right: 20px;
|
}
|
.leftIcon {
|
display: flex;
|
height: 150rpx;
|
flex-direction: column;
|
justify-content: space-between;
|
.leftOneDiv {
|
width: 46rpx;
|
height: 46rpx;
|
background: #035cfb;
|
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(255, 255, 255, 0.85);
|
border-radius: 5rpx;
|
text-align: center;
|
.leftOne {
|
width: 31rpx;
|
height: 31rpx;
|
font-size: 30rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 400;
|
color: #ffffff;
|
}
|
}
|
.rightDiv {
|
width: 46rpx;
|
height: 46rpx;
|
background: #f1333c;
|
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(255, 255, 255, 0.85);
|
border-radius: 5rpx;
|
text-align: center;
|
.rightone {
|
width: 29rpx;
|
height: 31rpx;
|
font-size: 30rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 400;
|
color: #ffffff;
|
}
|
}
|
.leftLine {
|
width: 2rpx;
|
height: 43rpx;
|
border-right: 2px dotted #303030;
|
transform: translateX(15rpx);
|
}
|
}
|
}
|
.centerTitle {
|
display: flex;
|
flex-direction: column;
|
justify-content: space-between;
|
height: 150rpx;
|
text-indent: 15px;
|
.centerLine {
|
width: 510rpx;
|
height: 1rpx;
|
margin-left: 15px;
|
border-bottom: solid 1px #ccc;
|
}
|
}
|
|
.twoLine {
|
flex: 0 1 25%;
|
width: 92%;
|
margin: 0 auto;
|
margin-top: 35rpx;
|
display: flex;
|
justify-content: space-between;
|
.twoleft {
|
display: flex;
|
justify-content: space-around;
|
align-items: center;
|
.send-date {
|
font-size: 28rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 300;
|
color: #515151;
|
}
|
}
|
.twoRight {
|
width: 210rpx;
|
display: flex;
|
justify-content: space-around;
|
}
|
}
|
.threeLine {
|
flex: 0 1 25%;
|
display: flex;
|
width: 92%;
|
margin: 0 auto;
|
height: 100rpx;
|
justify-content: space-between;
|
align-items: center;
|
.date {
|
display: flex;
|
align-items: center;
|
justify-content: space-around;
|
.send-date {
|
font-size: 28rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 300;
|
color: #515151;
|
}
|
}
|
.more {
|
font-size: 24rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 300;
|
margin-right: 20rpx;
|
|
.qiangdanBtn {
|
width: 230rpx;
|
height: 60rpx;
|
font-weight: 300;
|
font-size: 28rpx;
|
color: #ffffff;
|
font-weight: 300;
|
background: url("@/static/image/无人值守/司机端首页/矩形 4.jpg")
|
no-repeat;
|
background-position: center center;
|
background-color: linear-gradient(90deg, rgba(73,123,251,0.32), rgba(72,16,255,0.32));
|
box-shadow: 2rpx 3rpx 13rpx 0rpx rgba(43,98,239,0.5), 0rpx 0rpx 9rpx 0rpx rgba(247,250,253,0.29);
|
text-align: center;
|
line-height: 60rpx;
|
font-family: Microsoft YaHei;
|
border-radius: 40rpx;
|
margin-bottom: 30rpx;
|
}
|
}
|
}
|
}
|
.pendingAppointment {
|
width: 690rpx;
|
height: 351rpx;
|
background: #ffffff;
|
box-shadow: 4rpx 6rpx 25rpx 0rpx rgba(73, 120, 240, 0.15);
|
border-radius: 20rpx;
|
margin: 30rpx auto;
|
padding-top: 20rpx;
|
.firstLine {
|
flex: 0 1 60%;
|
width: 95%;
|
margin: 0 auto;
|
display: flex;
|
.rightIcon {
|
display: flex;
|
height: 150rpx;
|
flex-direction: column;
|
justify-content: space-between;
|
}
|
.leftIcon {
|
display: flex;
|
height: 150rpx;
|
flex-direction: column;
|
justify-content: space-between;
|
.leftOneDiv {
|
width: 46rpx;
|
height: 46rpx;
|
background: #035cfb;
|
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(255, 255, 255, 0.85);
|
border-radius: 5rpx;
|
text-align: center;
|
.leftOne {
|
width: 31rpx;
|
height: 31rpx;
|
font-size: 30rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 400;
|
color: #ffffff;
|
}
|
}
|
.rightDiv {
|
width: 46rpx;
|
height: 46rpx;
|
background: #f1333c;
|
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(255, 255, 255, 0.85);
|
border-radius: 5rpx;
|
text-align: center;
|
.rightone {
|
width: 29rpx;
|
height: 31rpx;
|
font-size: 30rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 400;
|
color: #ffffff;
|
}
|
}
|
.leftLine {
|
width: 2rpx;
|
height: 43rpx;
|
border-right: 2px dotted #303030;
|
transform: translateX(15rpx);
|
}
|
}
|
}
|
.centerTitle {
|
display: flex;
|
flex-direction: column;
|
justify-content: space-between;
|
height: 150rpx;
|
text-indent: 20px;
|
.centerLine {
|
width: 510rpx;
|
margin-left: 20px;
|
height: 1rpx;
|
border-bottom: solid 1px #ccc;
|
}
|
}
|
|
.twoLine {
|
flex: 0 1 25%;
|
width: 92%;
|
margin: 0 auto;
|
margin-top: 35rpx;
|
display: flex;
|
justify-content: space-between;
|
.twoleft {
|
display: flex;
|
justify-content: space-around;
|
align-items: center;
|
.send-date {
|
font-size: 28rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 300;
|
color: #515151;
|
}
|
span {
|
font-size: 28rpx;
|
margin-left: 10rpx;
|
}
|
}
|
.twoRight {
|
width: 210rpx;
|
display: flex;
|
justify-content: space-around;
|
}
|
}
|
.threeLine {
|
flex: 0 1 25%;
|
display: flex;
|
width: 92%;
|
margin: 0 auto;
|
height: 100rpx;
|
justify-content: space-between;
|
align-items: center;
|
.date {
|
width: 300rpx;
|
display: flex;
|
align-items: center;
|
justify-content: space-around;
|
.send-date {
|
width: 260rpx;
|
font-size: 25rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 300;
|
color: #515151;
|
}
|
}
|
.more {
|
font-size: 24rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 300;
|
margin-right: 20rpx;
|
.qiangdanBtn {
|
width: 230rpx;
|
height: 60rpx;
|
font-weight: 300;
|
font-size: 28rpx;
|
color: #ffffff;
|
background: url("@/static/image/无人值守/司机端首页/矩形 4.jpg")
|
no-repeat;
|
background-position: center center;
|
background-color: linear-gradient(90deg, rgba(73,123,251,0.32), rgba(72,16,255,0.32));
|
box-shadow: 2rpx 3rpx 13rpx 0rpx rgba(43,98,239,0.5), 0rpx 0rpx 9rpx 0rpx rgba(247,250,253,0.29);
|
text-align: center;
|
line-height: 60rpx;
|
font-family: Microsoft YaHei;
|
border-radius: 40rpx;
|
margin-bottom: 30rpx;
|
}
|
}
|
}
|
}
|
.tongzhi {
|
width: 94%;
|
margin: 0 auto;
|
// height: 280rpx;
|
// background-color: #fff;
|
box-shadow: 0rpx 0rpx 14rpx 0rpx rgba(73, 120, 240, 0.14),
|
0rpx 7rpx 45rpx 0rpx rgba(73, 120, 240, 0.12);
|
border-radius: 20rpx;
|
transform: translateY(-10rpx);
|
padding-bottom: 100rpx;
|
.u-list{
|
height: auto !important;
|
}
|
}
|
.listItem {
|
display: flex;
|
align-items: center;
|
height: 80rpx;
|
width: 94%;
|
justify-content: space-between;
|
border-bottom: solid 1px #e3e3e3;
|
margin: 0 auto;
|
margin-top: 20rpx;
|
.listDate {
|
font-size: 24rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 300;
|
color: #6e6e6e;
|
}
|
.listItemTop {
|
display: flex;
|
justify-content: space-around;
|
align-items: center;
|
font-size: 28rpx;
|
white-space: nowrap;
|
text-overflow: ellipsis;
|
overflow: hidden;
|
}
|
}
|
}
|
}
|
.gridBoxBg {
|
// box-shadow:0 0 10px 10px #9fb1c5;
|
width: 90%;
|
margin: 20rpx auto 10rpx;
|
}
|
.mark {
|
height: calc(100vh - 60vh);
|
background-color: #ccc;
|
position: absolute;
|
bottom: 0;
|
width: 100%;
|
left: 0;
|
z-index: 1;
|
opacity: 0.6;
|
transition: 2.5s all;
|
}
|
// .no-right {
|
// /* .left-top, .left-bottom 组合 */
|
// box-shadow: -5px -5px 10px -4px #fff, -5px 5px 10px -4px #fff;
|
// }
|
// .no-left {
|
// /* .right-bottom, .right-top 组合 */
|
// box-shadow: 5px 5px 10px -4px #fff, 5px -5px 10px -4px #fff;
|
// }
|
</style>
|
