| | |
| | | <template> |
| | | <view class="bill-of-lading-details"> |
| | | <view class="top-banner" |
| | | style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/loadingbanner.png') no-repeat;background-size: cover;"> |
| | | :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/loadingbanner.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }"> |
| | | </view> |
| | | <view class="top-information"> |
| | | <view class="cutomer-name" |
| | |
| | | <view class="basic"> |
| | | <view class="coalName">{{ coalDetailsData.coalName||'' }}</view> |
| | | <view class="status-button" |
| | | style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/statusbutton.png') no-repeat; |
| | | background-size: cover;"> |
| | | :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/statusbutton.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }"> |
| | | {{ coalStatus[coalDetailsData.statusWeigh] || '' }} |
| | | </view> |
| | | </view> |
| | |
| | | size="40"></u-icon></view> |
| | | <view class="send-date">{{ coalDetailsData.sendDate }}</view> |
| | | </view> |
| | | <view class="coal-code">提煤单编号: {{ coalDetailsData.code || '' }}</view> |
| | | <view class="coal-code">通知单编号: {{ coalDetailsData.code || '' }}</view> |
| | | <view class="order-code"> |
| | | 订单编号: {{ coalDetailsData.orderCode || '' }}</view> |
| | | <view class="coal-code" |
| | |
| | | style="color: rgb(73, 123, 251);"> |
| | | 查看明细 |
| | | </view> |
| | | <view class="weigh-item" |
| | | v-for='item in showWeigh' |
| | | :key="item.id"> |
| | | <view class="item"> |
| | | <view class="concrete" |
| | | style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/skin.png') no-repeat;background-size: cover;"> |
| | | 皮</view> |
| | | <view class="num">{{ item.skin }}</view> |
| | | </view> |
| | | <view class="item"> |
| | | <view class="concrete" |
| | | style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/hair.png') no-repeat;background-size: cover;"> |
| | | 毛</view> |
| | | <view class="num">{{ item.hair }}</view> |
| | | </view> |
| | | <view class="item"> |
| | | <view class="concrete" |
| | | style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/clean.png') no-repeat;background-size: cover;"> |
| | | 净</view> |
| | | <view class="num">{{ item.clean }}</view> |
| | | </view> |
| | | </view> |
| | | |
| | | </view> |
| | | </view> |
| | | |
| | | |
| | | <!-- 称重历史--> |
| | | <weigh-item :list="showWeigh"></weigh-item> |
| | | <!-- 时间线 --> |
| | | <view class="timeLine"> |
| | | <u-steps :current="dayRZ.length - 1" |
| | | direction="column" |
| | |
| | | </view> |
| | | </view> |
| | | <view class="weigh-ability"> |
| | | <view class="weigh-button"><u-button text="展示提煤单" |
| | | <view class="weigh-button"><u-button text="展示通知单" |
| | | @click="showCaolPickUpBill" |
| | | type="primary" |
| | | shape="circle"></u-button></view> |
| | |
| | | <view class="completeOutSale"> |
| | | <u-modal :show="completeOutSaleShow" |
| | | title="确认" |
| | | content="是否完成外销提煤单" |
| | | content="是否完成外销通知单" |
| | | :showCancelButton="true" |
| | | @confirm="completeOutSaleConfirm" |
| | | @cancel="completeOutSaleCancel"></u-modal> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { onlineurl } from '@/api/request.js' |
| | | import { webSocketUrl } from '@/api/request.js'; |
| | | import { mapState, mapMutations } from 'vuex'; |
| | | import weighItem from '@/components/weighItem.vue' |
| | | export default { |
| | | components: { |
| | | weighItem |
| | | }, |
| | | onLoad(value) { |
| | | this.orderPlanId = value.orderPlanId; |
| | | this.yyId = value.yyId; |
| | |
| | | orderPlanId: null, |
| | | yyId: null, |
| | | dayRZ: [], |
| | | coalDetailsData: {}, // 提煤单详情 |
| | | currentPageCoalStatus: 0, // 当前页面提煤单状态 |
| | | coalDetailsData: {}, // 通知单详情 |
| | | currentPageCoalStatus: 0, // 当前页面通知单状态 |
| | | // 获取所在磅房参数 |
| | | getWeightHouseObj: { |
| | | deptId: '', |
| | |
| | | openId: null, |
| | | openName: '' |
| | | }, |
| | | coalStatus: ['未称重', '称重中', '验质中', '称重完成'], // 状态 |
| | | coalStatus: ['未称重', '称重中', '验质中', '称重完成', '验质完成'], // 状态 |
| | | weighHouseCode: '', |
| | | // 放空弹窗控制变量 |
| | | evacuationModalShow: false, |
| | |
| | | clean: "" |
| | | }, |
| | | completeOutSaleShow: false, |
| | | overTmWaixiao: null |
| | | |
| | | overTmWaixiao: null, |
| | | // 判读网络状态, |
| | | normalCode: true, |
| | | onlineurl, |
| | | }; |
| | | }, |
| | | onShow() { |
| | |
| | | init() { |
| | | this.$reqGet('coalDayPage', { id: this.orderPlanId }).then(res => { |
| | | if (res.code == 0) { |
| | | // this.dayRZ = res.data; |
| | | this.dayRZ = res.data.map(v => { |
| | | let slicedate = v.taskStatusDes.slice(0, 10); |
| | | if (slicedate == this.currentDate) { |
| | |
| | | } |
| | | }); |
| | | this.coalDayPage(); //获取日志 |
| | | this.getTakeCoal(); //获取提煤单详情 |
| | | this.getTakeCoal(); //获取通知单详情 |
| | | this.getgetService(); //获取客服 |
| | | }, |
| | | // 获取客服openid |
| | |
| | | } |
| | | }); |
| | | }, |
| | | // 获取提煤单详情 |
| | | // 获取通知单详情 |
| | | getTakeCoal() { |
| | | uni.showLoading({ |
| | | title: '加载中' |
| | |
| | | this.$reqGet('getTakeCoal', { takeCoalId: this.orderPlanId }).then(res => { |
| | | uni.hideLoading(); |
| | | if (res.code == 0) { |
| | | console.log(res, '提煤单详情'); |
| | | console.log(res, '通知单详情'); |
| | | this.coalDetailsData = res.data; |
| | | this.orderType = this.coalDetailsData.orderType; |
| | | // 判断是否完成外销订单 |
| | |
| | | // 获取客服openId参数赋值 |
| | | this.getServiceOpenid.deptId = this.coalDetailsData.deptId; |
| | | this.getServiceOpenid.filedId = this.coalDetailsData.filedId; |
| | | // 获取提煤单状态 |
| | | // 获取通知单状态 |
| | | this.currentPageCoalStatus = this.coalDetailsData.statusWeigh; |
| | | // 获取原发信息 |
| | | this.primarySkin = this.coalDetailsData.skinTwo; |
| | |
| | | }, |
| | | // 日志查询 |
| | | coalDayPage() { |
| | | this.interval = setInterval(() => { |
| | | this.$reqGet('coalDayPage', { id: this.orderPlanId }).then(res => { |
| | | if (res.code == 0) { |
| | | // this.dayRZ = res.data; |
| | | this.dayRZ = res.data.map(v => { |
| | | let slicedate = v.taskStatusDes.slice(0, 10); |
| | | if (slicedate == this.currentDate) { |
| | | return { |
| | | ...v, |
| | | taskStatusDes: v.taskStatusDes.slice(10) |
| | | }; |
| | | } else { |
| | | return { ...v } |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | }, 10000); |
| | | if (this.normalCode) { |
| | | this.interval = setInterval(() => { |
| | | this.$reqGet('coalDayPage', { id: this.orderPlanId }).then(res => { |
| | | if (res.code == 0) { |
| | | this.normalCode = true; |
| | | this.dayRZ = res.data.map(v => { |
| | | let slicedate = v.taskStatusDes.slice(0, 10); |
| | | if (slicedate == this.currentDate) { |
| | | return { |
| | | ...v, |
| | | taskStatusDes: v.taskStatusDes.slice(10) |
| | | }; |
| | | } else { |
| | | return { ...v } |
| | | } |
| | | }); |
| | | } else { |
| | | this.normalCode = false; |
| | | } |
| | | }); |
| | | }, 10000); |
| | | } else { |
| | | clearInterval(this.interval) |
| | | this.$u.toast('服务器错误,请稍后重试') |
| | | } |
| | | }, |
| | | // 展示提煤单详情 |
| | | // 展示通知单详情 |
| | | showCaolPickUpBill() { |
| | | uni.navigateTo({ |
| | | url: `/pages/driver-page/driver-index/bill-of-lading-details/coal-pick-up-bill/coal-pick-up-bill?orderPlanId=${this.orderPlanId}` |
| | |
| | | console.log('获取失败'); |
| | | } |
| | | }); |
| | | }, |
| | | calling() { |
| | | // wx.join1v1Chat({ |
| | | // caller: { nickname: this.name, openid: this.openid }, //oZjXk5RRmbroAfl1m5aZ6hRNvqh4 |
| | | // listener: { nickname: this.serviceInfoObj.openName, openid: 'orutI5YT0yEvARVngdsTmBpisWmw' }, // 这里的openid是fyy的,充当固定的客服openid |
| | | // backgroundType: 2, |
| | | // roomType: 'voice' |
| | | // }); |
| | | }, |
| | | // 称重 |
| | | cengZhongClick() { |
| | |
| | | height: 100%; |
| | | min-height: 380rpx; |
| | | margin: vww(18) vww(7) vww(11) vww(17); |
| | | // flex-direction: column; |
| | | // justify-content: space-between; |
| | | // align-items: flex-start; |
| | | } |
| | | |
| | | .status-button { |
| | |
| | | color: #7d7d7d; |
| | | } |
| | | |
| | | .weigh-item { |
| | | width: 100%; |
| | | height: vww(36); |
| | | @include flex; |
| | | justify-content: space-around; |
| | | |
| | | .item { |
| | | min-width: vww(50); |
| | | height: vww(45); |
| | | font-size: 21rpx; |
| | | font-weight: 400; |
| | | color: #ffffff; |
| | | text-align: center; |
| | | line-height: vww(30); |
| | | } |
| | | |
| | | // 称重历史 |
| | | .weigh-history { |
| | | @extend .block-information; |
| | | |
| | | .block-main { |
| | | @extend .block-main; |
| | | gap: 10rpx 20rpx; |
| | | |
| | | .weigh-item { |
| | | width: 100%; |
| | | height: vww(80); |
| | | @include flex; |
| | | flex-direction: column; |
| | | justify-content: space-around; |
| | | align-items: flex-start; |
| | | |
| | | .concrete { |
| | | width: vww(36); |
| | | .item-block { |
| | | width: 100%; |
| | | height: vww(36); |
| | | } |
| | | @include flex; |
| | | justify-content: space-around; |
| | | |
| | | .num { |
| | | font-size: 40rpx; |
| | | font-weight: 300; |
| | | color: #303030; |
| | | .item { |
| | | min-width: vww(50); |
| | | height: vww(45); |
| | | font-size: 21rpx; |
| | | font-weight: 400; |
| | | color: #ffffff; |
| | | text-align: center; |
| | | line-height: vww(30); |
| | | @include flex; |
| | | |
| | | .concrete { |
| | | width: vww(36); |
| | | height: vww(36); |
| | | } |
| | | |
| | | .num { |
| | | font-size: 40rpx; |
| | | font-weight: 300; |
| | | color: #303030; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | |
| | | // 时间线 |
| | | .timeLine { |
| | | height: 40%; |
| | | height: 300rpx; |
| | | min-height: 300rpx; |
| | | margin: vww(20); |
| | | position: relative; |