| | |
| | | </view> |
| | | </view> |
| | | |
| | | <view class="order-page__tabs" :style="{ top: navHeight + 'px' }"> |
| | | <view class="order-page__search" :style="{ top: navHeight + 'px' }"> |
| | | <view class="order-page__search-box"> |
| | | <u-icon name="search" color="#999999" size="28"></u-icon> |
| | | <input class="order-page__search-input" v-model="searchKeyword" placeholder="输入姓名、电话、订单编号搜索" placeholder-class="order-page__search-placeholder" @confirm="searchOrder" /> |
| | | </view> |
| | | </view> |
| | | |
| | | <view class="order-page__tabs" :style="{ top: (navHeight + 44) + 'px' }"> |
| | | <view v-for="tab in displayTabs" :key="tab.value" class="order-page__tab" :class="{ 'order-page__tab--active': activeTab === tab.value }" @click="activeTab = tab.value"> |
| | | <text class="order-page__tab-text">{{ tab.label }}</text> |
| | | <view v-if="activeTab === tab.value" class="order-page__tab-line"></view> |
| | |
| | | <view class="order-card__route-item"> |
| | | <view class="order-card__point order-card__point--pickup">取</view> |
| | | <view class="order-card__route-texts"> |
| | | <text class="order-card__route-title">{{ item.takeName }}</text> |
| | | <text class="order-card__route-desc">{{ item.takeAddress }}</text> |
| | | <text class="order-card__route-title">{{ item.depositShopName }}</text> |
| | | <text class="order-card__route-desc">{{ item.depositShopAddress }}</text> |
| | | </view> |
| | | </view> |
| | | |
| | | <view class="order-card__route-item order-card__route-item--delivery"> |
| | | <view class="order-card__point order-card__point--delivery">送</view> |
| | | <view class="order-card__route-texts"> |
| | | <text class="order-card__route-title">{{ item.depositShopName }}</text> |
| | | <text class="order-card__route-desc">{{ item.depositShopAddress }}</text> |
| | | <text class="order-card__route-title">{{ item.takeName }}</text> |
| | | <text class="order-card__route-desc">{{ item.takeAddress }}</text> |
| | | </view> |
| | | </view> |
| | | |
| | |
| | | statusBarHeight: 0, |
| | | navHeight: 0, |
| | | activeTab: null, |
| | | searchKeyword: '', |
| | | tabs: [ |
| | | { label: '全部', value: null }, |
| | | { label: '待取货', value: 3 }, |
| | |
| | | |
| | | bodyStyle() { |
| | | return { |
| | | marginTop: this.navHeight + uni.upx2px(88) + 'px', |
| | | height: `calc(100vh - ${this.navHeight + uni.upx2px(88)}px)` |
| | | marginTop: this.navHeight + uni.upx2px(88) + uni.upx2px(88) + 'px', |
| | | height: `calc(100vh - ${this.navHeight + uni.upx2px(88) + uni.upx2px(72)}px)` |
| | | } |
| | | }, |
| | | photoPopupTitle() { |
| | |
| | | } |
| | | }, |
| | | methods: { |
| | | searchOrder() { |
| | | this.page = 1 |
| | | this.hasMore = true |
| | | this.orders = [] |
| | | this.getOrderList() |
| | | }, |
| | | getActiveOrderCount() { |
| | | this.$u.api.activeOrderCount().then(res => { |
| | | if (res.code === 200) { |
| | |
| | | 2: '待接单', |
| | | 3: '待取货', |
| | | 4: '配送中', |
| | | 5: '已完成', |
| | | 5: '已送达', |
| | | 7: '已完成', |
| | | 99: '已取消' |
| | | } |
| | |
| | | capacity: 10, |
| | | page: this.page, |
| | | model: { |
| | | status: this.activeTab |
| | | status: this.activeTab, |
| | | keyword: this.searchKeyword |
| | | } |
| | | }).then(res => { |
| | | if (res.code === 200) { |
| | | const list = res.data.records || [] |
| | | console.log(list) |
| | | if (this.page === 1) { |
| | | this.orders = list |
| | | } else { |
| | |
| | | this.showQRPopup = true |
| | | }, |
| | | handlePhotoPickup(item) { |
| | | this.selectedOrder = item |
| | | this.photoPopupMode = 'pickup' |
| | | this.uploadedPhotos = [] |
| | | this.photoRemark = '' |
| | | this.showPhotoPopup = true |
| | | this.checkOperationRadius(item.id, 'pickup') |
| | | }, |
| | | handlePhotoDeliver(item) { |
| | | this.selectedOrder = item |
| | | this.photoPopupMode = 'deliver' |
| | | this.uploadedPhotos = [] |
| | | this.photoRemark = '' |
| | | this.showPhotoPopup = true |
| | | this.checkOperationRadius(item.id, 'deliver') |
| | | }, |
| | | checkOperationRadius(orderId, mode) { |
| | | uni.getLocation({ |
| | | type: 'gcj02', |
| | | success: (res) => { |
| | | this.$u.api.checkDriverOperationRadius({ |
| | | lat: res.latitude, |
| | | lng: res.longitude, |
| | | orderId: orderId |
| | | }).then(apiRes => { |
| | | if (apiRes.code === 200) { |
| | | console.log(apiRes.data) |
| | | if (apiRes.data === true) { |
| | | this.selectedOrder = { id: orderId } |
| | | this.photoPopupMode = mode |
| | | this.uploadedPhotos = [] |
| | | this.photoRemark = '' |
| | | this.showPhotoPopup = true |
| | | } else { |
| | | uni.showToast({ |
| | | title: '您当前位置与收货地址距离超出范围,请在地址附近重新拍照', |
| | | icon: 'none' |
| | | }) |
| | | } |
| | | } |
| | | }) |
| | | }, |
| | | fail: () => { |
| | | uni.showToast({ |
| | | title: '无法获取您的位置信息', |
| | | icon: 'none' |
| | | }) |
| | | } |
| | | }) |
| | | }, |
| | | closePhotoPopup() { |
| | | this.showPhotoPopup = false |
| | |
| | | color: #ffffff; |
| | | } |
| | | |
| | | &__search { |
| | | position: fixed; |
| | | left: 0; |
| | | right: 0; |
| | | z-index: 10; |
| | | height: 88rpx; |
| | | padding: 8rpx 30rpx; |
| | | box-sizing: border-box; |
| | | display: flex; |
| | | align-items: center; |
| | | background: #ffffff; |
| | | } |
| | | |
| | | &__search-box { |
| | | width: 100%; |
| | | height: 72rpx; |
| | | display: flex; |
| | | align-items: center; |
| | | padding: 0 24rpx; |
| | | background: #EEEEEE; |
| | | border-radius: 16rpx; |
| | | } |
| | | |
| | | &__search-input { |
| | | flex: 1; |
| | | height: 72rpx; |
| | | margin-left: 12rpx; |
| | | color: #333333; |
| | | font-weight: 400; |
| | | font-size: 26rpx; |
| | | } |
| | | |
| | | &__search-placeholder { |
| | | font-size: 28rpx; |
| | | color: #999999; |
| | | } |
| | | |
| | | &__tabs { |
| | | position: fixed; |
| | | left: 0; |