| | |
| | | size="40"></u-icon> |
| | | </div> |
| | | </div> |
| | | <div class="statusBox"> |
| | | <view class="status"> |
| | | <u-tag :text="coalStatus[item.statusWeigh] || ''" |
| | | plain> |
| | | </u-tag> |
| | | </view> |
| | | </div> |
| | | |
| | | <div class="twoLine"> |
| | | <div class="twoleft"> |
| | | <view class="time-icon"><u-icon name="clock" |
| | |
| | | </div> |
| | | </div> |
| | | <div class="threeLine"> |
| | | <span class="more">MORE>></span> |
| | | <span class="more" @click="todoHistory">MORE>></span> |
| | | </div> |
| | | </div> |
| | | |
| | | <!-- 九宫格 --> |
| | | <view class="gridBox"> |
| | | <view class="gridBox" > |
| | | <u-grid |
| | | :border="false" |
| | | col="4" |
| | | v-if="!loading" |
| | | > |
| | | <u-grid-item |
| | | v-for="(listItem,listIndex) in list" |
| | |
| | | <view class="time-icon"><u-icon name="clock" |
| | | color="#515151" |
| | | size="30"></u-icon></view> |
| | | <view class="send-date"><text class="create-date"> {{ item.createTime }}</text></view> |
| | | <view class="send-date"> {{ item.createTime }}</view> |
| | | </div> |
| | | <span class="more"> |
| | | <div class="qiangdanBtn">立即抢单</div> |
| | | <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" |
| | | iconSize="30"></u-empty></div> |
| | | textSize="30"></u-empty></div> |
| | | <!-- 通知通告 --> |
| | | <combined-title title="通知公告"></combined-title> |
| | | <div class="tongzhi"> |
| | | <u-list |
| | | v-if="noticeList && noticeList.length" |
| | | height="280rpx" |
| | | @scrolltolower="scrolltolower" |
| | | pagingEnabled |
| | | > |
| | | <u-list-item |
| | | v-for="(item, index) in noticeList" |
| | | :key="index" |
| | | > |
| | | <u-cell |
| | | :title="`列表长度-${index + 1}`" |
| | | :value="item.date" |
| | | > |
| | | <u-avatar |
| | | <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> |
| | | </u-cell> |
| | | <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" |
| | | iconSize="30"></u-empty> |
| | | textSize="30"></u-empty> |
| | | </div> |
| | | <!-- 引导页 --> |
| | | <view class="noob-tour" |
| | |
| | | @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> |
| | | </div> |
| | | </template> |
| | | <script> |
| | | import { customerId } from '@/utils/status'; |
| | | 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'; |
| | | import labaIcon from '@/static/image/无人值守/司机端首页/组 27 拷贝 3.jpg' |
| | | import newIcon from '@/static/image/无人值守/司机端首页/组 27.jpg' |
| | | export default { |
| | | components: { |
| | | combinedTitle, |
| | |
| | | }, |
| | | data() { |
| | | return { |
| | | labaIcon, |
| | | newIcon, |
| | | noticeModelShow:false, |
| | | notice:{ |
| | | title:'', |
| | | content:"", |
| | | }, |
| | | noticeList: [], |
| | | urls: [ |
| | | 'https://cdn.uviewui.com/uview/album/1.jpg', |
| | |
| | | src: '/static/image/无人值守/司机端首页/组 15(1).jpg', |
| | | title: '历史订单' |
| | | }, |
| | | { |
| | | src: '/static/image/无人值守/司机端首页/组 15(2).jpg', |
| | | title: '质检' |
| | | }, |
| | | // { |
| | | // src: '/static/image/无人值守/司机端首页/组 15(2).jpg', |
| | | // title: '质检' |
| | | // }, |
| | | { |
| | | src: '/static/image/无人值守/司机端首页/组 15(3).jpg', |
| | | title: '车队管理' |
| | |
| | | }, |
| | | // 抢单模态框 |
| | | qiangDanShow: false, |
| | | noticePage:{ |
| | | current:1, |
| | | page:10, |
| | | }, |
| | | |
| | | qiangDanTitle: '抢单提示', |
| | | qiangDanContent: '', |
| | | qiangDanOrderPlanId: null, |
| | |
| | | mounted() { |
| | | // this.TourImgList = TourImgList |
| | | this.getLogOn() |
| | | |
| | | this.getNoticeList(); |
| | | }, |
| | | onShow() { |
| | | this.init(); |
| | | |
| | | }, |
| | | methods: { |
| | | // 跳转地图 |
| | |
| | | url: `/pages/public-page/aboutus/index` |
| | | }); |
| | | break; |
| | | |
| | | case '数据统计': |
| | | uni.navigateTo({ |
| | | url: `/pages/public-page/dataStatistics/index` |
| | | }); |
| | | break; |
| | | |
| | | case '历史订单': |
| | | uni.navigateTo({ |
| | | url: `/pages/driver-page/driver-index/bill-of-lading-details/historicalOrders/index?historyData=${JSON.stringify(this.driverBillOfLoadingData.list2)}` |
| | | }); |
| | | break; |
| | | |
| | | case '操作指南': |
| | | this.noobTour(); |
| | | break; |
| | | case '消息': |
| | | uni.navigateTo({ |
| | | url: '/pages/public-page/message/message' |
| | | }); |
| | | break; |
| | | |
| | | default: |
| | | break; |
| | |
| | | init() { |
| | | this.qiangDanList(); |
| | | }, |
| | | scrolltolower() { |
| | | this.loadmore() |
| | | }, |
| | | loadmore(){ |
| | | this.noticePage.current ++; |
| | | this.getNoticeList(); |
| | | |
| | | }, |
| | | 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({ |
| | |
| | | uni.hideLoading(); |
| | | this.driverBillOfLoadingData = res.data; |
| | | this.loading = false; |
| | | }); |
| | | }).finally(() => { |
| | | this.loading = false; |
| | | }) |
| | | }, |
| | | // 抢单按钮 |
| | | qiangDanBtn:Debounce(function(value){ |
| | |
| | | }); |
| | | }) |
| | | }, |
| | | todoHistory(){ |
| | | uni.navigateTo({ |
| | | url: `/pages/driver-page/driver-index/bill-of-lading-details/historicalOrders/index` |
| | | }); |
| | | }, |
| | | todoNotice(item){ |
| | | console.log(item,'item') |
| | | if(item){ |
| | | this.noticeModelShow = true; |
| | | this.notice = item; |
| | | } |
| | | |
| | | }, |
| | | noticConfirm(){ |
| | | this.noticeModelShow = false; |
| | | } |
| | | |
| | | } |
| | | }; |
| | |
| | | } |
| | | .ingOrder{ |
| | | width: 94%; |
| | | height: 330rpx; |
| | | height: 380rpx; |
| | | 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); |
| | |
| | | display: flex; |
| | | flex-direction: column; |
| | | padding-top: 20rpx; |
| | | .statusBox{ |
| | | width: 94%; |
| | | margin: 0 auto; |
| | | margin-top: 20rpx; |
| | | } |
| | | .status{ |
| | | display: flex; |
| | | width: 150rpx; |
| | | } |
| | | |
| | | .firstLine{ |
| | | flex: 0 1 60%; |
| | |
| | | .twoLine{ |
| | | flex: 0 1 25%; |
| | | width: 92%; |
| | | margin: 35rpx auto; |
| | | margin: 20rpx auto; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | .twoleft{ |
| | | width: 313rpx; |
| | | width: 325rpx; |
| | | display: flex; |
| | | justify-content: space-around; |
| | | align-items: center; |
| | |
| | | justify-content: flex-end; |
| | | height: 100rpx; |
| | | margin-bottom: 20rpx; |
| | | transform: translateY(-20rpx); |
| | | .more{ |
| | | width: 106rpx; |
| | | height: 20rpx; |
| | |
| | | font-family: Microsoft YaHei; |
| | | font-weight: 300; |
| | | margin-right: 20rpx; |
| | | |
| | | .qiangdanBtn{ |
| | | width: 230rpx; |
| | | height:60rpx; |
| | |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | .date{ |
| | | width: 200rpx; |
| | | width: 300rpx; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-around; |
| | | .send-date{ |
| | | font-size: 28rpx; |
| | | width: 260rpx; |
| | | font-size: 25rpx; |
| | | font-family: Microsoft YaHei; |
| | | font-weight: 300; |
| | | color: #515151; |
| | |
| | | width: 94%; |
| | | margin: 0 auto; |
| | | height: 280rpx; |
| | | background-color: #fff; |
| | | // 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); |
| | | } |
| | | .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; |
| | | } |
| | | |
| | | } |
| | | } |
| | | |
| | | } |