<template>
|
<view class="main">
|
<view>
|
<u-empty mode="data"
|
icon="http://cdn.uviewui.com/uview/empty/data.png"
|
textSize="30"
|
iconSize="1000"
|
text="暂无数据"
|
v-if="orderPlanData.length===0"></u-empty>
|
</view>
|
<view class="collection-form">
|
<view class="collection-form-item"
|
v-for="(item, index) in orderPlanData"
|
:key="index">
|
<view class="first-line">
|
<view class="dispatch-receive">
|
<view class="dispatch">{{ item.filedName||'' }}</view>
|
</view>
|
<view class="point-number"
|
v-if="roleType == 1">
|
<text class="residue">{{ item.cars2||'' }}</text>
|
<text>/{{ item.carNum ||''}}</text>
|
</view>
|
</view>
|
<view class="second-line">
|
<view class="coal-name">
|
<view class="">{{ item.coalName ||''}}</view>
|
<view class="black-bar"></view>
|
<view class="coal-type"
|
v-if="item.orderType">{{ item.orderType||'' }}</view>
|
</view>
|
</view>
|
<view class="second-line">
|
<view class="coal-name">
|
<view class="">{{ item.orderCode ||''}}</view>
|
</view>
|
</view>
|
<view class="second-line">
|
|
<text class="car-num " style="font-size: 28rpx;">供应商：{{ item.customerName }}</text>
|
|
</view>
|
<!-- 添加创建时间 -->
|
<view class="second-line">
|
|
<text class="car-num " style="font-size: 28rpx;">创建时间：</text>
|
|
<view style="font-size: 28rpx;">{{ item.createTime }}</view>
|
</view>
|
<view class="second-line">
|
<text class="car-num " style="font-size: 28rpx;">司机：{{ item.xsUser1Name }}</text>
|
</view>
|
<view class="third-line">
|
<view class="time-icon">
|
<view
|
:style="{backgroundImage: `url(${onlineurl}/appimg/image/banner/carNO.png)`,backgroundSize: 'cover',backgroundRepeat: 'no-repeat',width:'24rpx',height:'24rpx',lineHeight:'24rpx'}">
|
</view>
|
</view>
|
<view class="car-num">{{ item.noCarNo == 1 ? '无车牌' : (item.carNo || '') }}</view>
|
</view>
|
<view class="fourth-line-outside">
|
<view class="third-line">
|
<view class="time-icon">
|
<view
|
:style="{backgroundImage: `url(${onlineurl}/appimg/image/banner/clock.png)`,backgroundSize: 'cover',backgroundRepeat: 'no-repeat',width:'24rpx',height:'24rpx',lineHeight:'24rpx'}">
|
</view>
|
</view>
|
<view class="send-date">{{ item.sendDate }}</view>
|
</view>
|
<view class="fourth-line">
|
<view class="forward"
|
@click.stop="validateClick(item)"
|
v-if='roleType===4'>
|
<view class="button-image">选择</view>
|
</view>
|
</view>
|
</view>
|
|
</view>
|
</view>
|
<view class="history-numbers">
|
<combined-title title="历史验质完成"></combined-title>
|
<scroll-view :scroll-top="scrollTop"
|
scroll-y="true"
|
class="scroll-Y"
|
style="height:85vh"
|
@scrolltolower="historyScrolltolower">
|
<u-empty mode="data"
|
icon="http://cdn.uviewui.com/uview/empty/data.png"
|
textSize="30"
|
iconSize="1000"
|
text="暂无数据"
|
v-if="historyCoalData.length==0"></u-empty>
|
<view class="history-information"
|
v-for="(item, index) in historyCoalData"
|
:key="index"
|
@click="faYundetail(item)">
|
<view class="first">
|
<view class="">{{ item.filedName || '' }}</view>
|
<view class=""><u-icon name="arrow-right"
|
color="#999999"
|
size="40"></u-icon></view>
|
</view>
|
<view class="second">
|
<view class="coal-name">{{ item.coalName || '' }}</view>
|
<view class="order-type">{{ item.orderType || '' }}</view>
|
</view>
|
<!-- 添加创建时间 -->
|
<view class="third">
|
<view class="third-line">
|
<view class="time-icon">
|
<text class="car-num " style="font-size: 28rpx;">创建时间：</text>
|
</view>
|
|
<view style="font-size: 28rpx;">{{ item.createTime }}</view>
|
</view>
|
</view>
|
<view class="third">
|
<text class="car-num " style="font-size: 28rpx;">供应商：{{ item.customerName }}</text>
|
</view>
|
<view class="third">
|
<text class="car-num " style="font-size: 28rpx;">司机：{{ item.xsUser1Name }}</text>
|
</view>
|
<view class="third">
|
<view class="third-line">
|
<view
|
:style="{backgroundImage: `url(${onlineurl}/appimg/image/banner/carNO.png)`,backgroundSize: 'cover',backgroundRepeat: 'no-repeat',width:'24rpx',height:'24rpx',lineHeight:'24rpx'}">
|
</view>
|
<view class="third-line_num"
|
style=" color: #303030;">{{ item.noCarNo == 1 ? '无车牌' : (item.carNo || '') }}</view>
|
</view>
|
</view>
|
<view class="fourth">
|
<view class="fourth-icon">
|
<view
|
:style="{backgroundImage: `url(${onlineurl}/appimg/image/banner/clock.png)`,backgroundSize: 'cover',backgroundRepeat: 'no-repeat',width:'24rpx',height:'24rpx',lineHeight:'24rpx'}">
|
</view>
|
</view>
|
<view class="senddate">{{ item.sendDate }}</view>
|
</view>
|
<view class="fourth">
|
<view class="fourth-icon">
|
<view
|
:style="{backgroundImage: `url(${onlineurl}/appimg/image/banner/carnNUm.png)`,backgroundSize: 'cover',backgroundRepeat: 'no-repeat',width:'24rpx',height:'24rpx',lineHeight:'24rpx'}">
|
</view>
|
</view>
|
<view class="senddate">{{ item.orderCode }}</view>
|
</view>
|
</view>
|
<view class="more_text"
|
v-if="showMoreData && historyCoalData.length !== 0">没有数据了...</view>
|
<view class="white-block"></view>
|
</scroll-view>
|
</view>
|
<!-- <view style="height: 160rpx;width: 100%;">
|
111111
|
</view> -->
|
<!-- 图片预览弹出框 -->
|
<view class="previewImage-container">
|
<view class="previewImage-container">
|
<previewImage ref="previewImage"
|
:imgs="qualityTourImgList"
|
:saveBtn='false'></previewImage>
|
</view>
|
</view>
|
<view class="noob-tour"
|
v-if="roleType===4&&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>
|
<tab-bar :current="0"></tab-bar>
|
</view>
|
</template>
|
|
<script>
|
import { onlineurl } from '@/api/request.js'
|
import { mapState } from 'vuex'
|
import { BaseUrl } from '@/api/publicInterface.js'
|
import previewImage from '@/components/kxj-previewImage/kxj-previewImage.vue';
|
export default {
|
data() {
|
return {
|
orderPlanData: [],
|
historyCoalData: [],
|
// 每页数据量
|
pageSize: 10,
|
// 当前页
|
pageCurrent: 1,
|
// 是否显示更多数据
|
showMoreData: false,
|
total: null,
|
isFirstLogin:false,
|
onlineurl,
|
};
|
},
|
components:{
|
previewImage
|
},
|
computed: {
|
...mapState(['customerTourImgList','qualityTourImgList']),
|
roleType() {
|
return uni.getStorageSync('roleType')
|
}
|
},
|
mounted() {
|
this.getLogOn();
|
},
|
onShow() {
|
this.GetOrderPlan()
|
this.qualityInspectionHistory()
|
},
|
methods: {
|
init(){
|
this.GetOrderPlan()
|
this.qualityInspectionHistory()
|
},
|
GetOrderPlan() {
|
uni.showLoading({ title: '加载中...' });
|
this.$reqGet('qualityInspection').then(res => {
|
if (res.data) {
|
uni.hideLoading();
|
this.orderPlanData = res.data
|
} else {
|
uni.hideLoading();
|
this.$u.toast('加载失败')
|
}
|
})
|
},
|
// 验质历史
|
qualityInspectionHistory() {
|
uni.showLoading({ title: '加载中...' });
|
this.$reqGet('qualityInspectionHistory', { current: this.pageCurrent, size: this.pageSize }).then(res => {
|
if (res.data) {
|
uni.hideLoading();
|
this.total = res.data.total;
|
if (this.pageCurrent > 1) {
|
this.historyCoalData = this.historyCoalData.concat(res.data.records);
|
this.historyCoalData = this.ArrSet(this.historyCoalData, 'id');
|
} else {
|
this.historyCoalData = res.data.records;
|
|
}
|
} else {
|
uni.hideLoading();
|
this.$u.toast('加载失败')
|
}
|
})
|
},
|
// 上拉加载
|
historyScrolltolower() {
|
if (this.pageCurrent * this.pageSize >= this.total) return (this.showMoreData = true);
|
this.pageCurrent++;
|
this.qualityInspectionHistory();
|
},
|
//fix 点击通知单返回会增加重复数据
|
ArrSet(Arr, id) {
|
var obj = {};
|
const arrays = Arr.reduce((setArr, item) => {
|
obj[item[id]] ? '' : (obj[item[id]] = true && setArr.push(item));
|
return setArr;
|
}, []);
|
return arrays;
|
},
|
// 验质选择
|
validateClick(item) {
|
uni.navigateTo({
|
url: `/pages/driver-page/driver-index/bill-of-lading-details/weighDetail/weighDetail?orderPlanId=${item.id}`
|
})
|
},
|
// 历史
|
faYundetail(item) {
|
uni.navigateTo({
|
url: `/pages/driver-page/driver-index/bill-of-lading-details/weighDetail/weighDetail?orderPlanId=${item.id}&flag=${true}`
|
})
|
},
|
noobTour(v) {
|
this.$refs.previewImage.open('https://mx.jzeg.cn:9095/appimg/image/tour/quality/quality1.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
|
}
|
}
|
});
|
})
|
},
|
},
|
}
|
</script>
|
|
<style lang="scss"
|
scoped>
|
@mixin flex {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
}
|
|
page{
|
width: 100%;
|
height: 100%;
|
}
|
.main {
|
width: 100%;
|
height: 100%;
|
margin: 30rpx auto;
|
padding-bottom: 60rpx;
|
box-sizing: border-box;
|
display: flex;
|
flex-direction: column;
|
}
|
|
.scroll-Y {
|
height: 100%;
|
|
.more_text {
|
color: #333;
|
font-size: 24rpx;
|
text-align: center;
|
}
|
}
|
|
.history-numbers {
|
width: 100%;
|
position: relative;
|
// top: vww(-110);
|
|
.history-information {
|
width: 690rpx;
|
margin: vww(10) vww(15);
|
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;
|
@include flex flex-direction: column;
|
align-items: flex-start;
|
justify-content: space-evenly;
|
overflow: hidden;
|
padding: 20rpx 0;
|
box-sizing: border-box;
|
|
.first {
|
width: 96%;
|
height: 34rpx;
|
font-size: 32rpx;
|
font-weight: 300;
|
color: #303030;
|
@include flex;
|
margin: vww(10) vww(10) 0;
|
}
|
|
.second {
|
width: 100%;
|
height: 31rpx;
|
font-size: 30rpx;
|
font-weight: 300;
|
color: #515151;
|
margin: vww(10) vww(10) 0;
|
@include flex;
|
justify-content: flex-start;
|
|
.coal-name {
|
min-width: vww(30);
|
height: vww(20);
|
margin-right: vww(21);
|
}
|
|
.order-type {
|
color: #035cfb;
|
border: 1px solid #035cfb;
|
border-radius: 4rpx;
|
padding: vww(4) vww(12);
|
text-align: center;
|
font-size: 20rpx;
|
line-height: 1;
|
}
|
}
|
|
.third {
|
width: 96%;
|
height: 31rpx;
|
font-size: 30rpx;
|
font-weight: 300;
|
color: #515151;
|
margin: vww(10) vww(10) 0;
|
@include flex;
|
|
.third-line {
|
@include flex;
|
|
&_text {
|
color: #919090;
|
}
|
|
&_num {
|
color: #035cfb;
|
}
|
}
|
}
|
|
.fourth {
|
width: 100%;
|
height: 31rpx;
|
font-size: 30rpx;
|
font-weight: 300;
|
color: #515151;
|
margin: vww(10) vww(10) 0;
|
@include flex;
|
|
.fourth-icon {
|
width: vww(13);
|
height: vww(13);
|
margin-right: vww(14);
|
}
|
|
.senddate {
|
flex: 1;
|
}
|
}
|
}
|
}
|
|
.collection-form {
|
width: vww(345);
|
margin: 0 vww(15);
|
position: relative;
|
|
.collection-form-item {
|
width: 690rpx;
|
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);
|
padding: 20rpx 0;
|
box-sizing: border-box;
|
|
.first-line {
|
width: 94%;
|
height: vww(30);
|
margin: vww(0) vww(16) 0 vww(16);
|
display: flex;
|
justify-content: space-between;
|
|
.dispatch-receive {
|
width: 70%;
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
}
|
|
.point-number {
|
width: 15%;
|
|
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-left: 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 {
|
width: 80%;
|
height: vww(30);
|
margin-left: vww(15);
|
display: flex;
|
justify-content: flex-start;
|
align-items: center;
|
|
.send-date {
|
margin-left: vww(14);
|
width: 148rpx;
|
height: 24rpx;
|
line-height: 24rpx;
|
font-size: 28rpx;
|
font-weight: 300;
|
color: #515151;
|
}
|
|
.car-num {
|
color: #515151;
|
white-space: nowrap;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
}
|
}
|
|
.fourth-line {
|
@include flex;
|
justify-content: flex-end;
|
|
.receive,
|
.forward {
|
|
@include flex;
|
justify-content: center;
|
color: #ffffff;
|
font-size: 28rpx;
|
position: absolute;
|
|
.button-image {
|
border: 1px solid #3b56eb;
|
border-radius: 40rpx;
|
width: vww(90);
|
height: vww(28);
|
background-size: 100% 100%;
|
font-size: 28rpx;
|
font-weight: 300;
|
color: #ffffff;
|
text-align: center;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
margin-right: 20rpx;
|
}
|
}
|
|
.receive {
|
left: vww(20);
|
}
|
|
.forward {
|
@include flex;
|
|
.button-image {
|
font-size: 28rpx;
|
font-weight: 300;
|
color: #3b56eb;
|
text-align: center;
|
}
|
}
|
|
}
|
}
|
}
|
.fourth-line-outside{
|
width: 100%;
|
display: flex;
|
justify-content: space-between;
|
.third-line{
|
width: auto!important;
|
}
|
.fourth-line{
|
width:auto!important;
|
}
|
}
|
</style>
|
