kuaiyidian-HD/pages/other/logistics.vue

<template>
	<view>
		<view>
			<button size="default" type="default" @tap="goAddPeople" hover-class="is-hover">上线</button>
		</view>
		<view class="contentPadding">
			<view class="title">
				<i class="iconfont icon-huaban"> 今日订单
					<view class="btn" @tap="gotoSearchData">
						历史订单 >
					</view>
				</i>
			</view>
		</view>
		<view class="item-wrapper">
			<u-subsection :list="list" :current="current" @change="sectionChange"></u-subsection>
			<view class="ulList" v-if="bList.length > 0">
				<ul>
					<li v-for="(item,index ) in bList" :key="index">
						<uni-card :title="'店铺名称:张三的店'" :sub-title="'明珠早市馆15001 （13521420172）'">
							<view class="uni-body">
								<text class="cardText">德邦物流</text>
								（15014256321）
							</view>
							<view class="uni-body">
								<text class="cardText"> 下单时间：</text>
								<text class="priceText"> 2023-11-29 12：00：01</text>
							</view>
							<view class="uni-body">
								<text class="cardText"> 订单状态：</text>
								待送达
							</view>
						</uni-card>
					</li>
				</ul>
			</view>
		</view>
		<u-modal :show="modalShow" title="详细地址" :content='content' @confirm="modalShow = false"></u-modal>
		<uni-fab ref="fab" :content="content" :horizontal="horizontal"
			@trigger="trigger" />
	</view>
</template>

<script>
	import tui from '../../common/httpRequest.js'

	export default {
		data() {
			return {
				range: '',
				name: '',
				shopList: [],
				list: ['待指派', '待取货', '待送达'],
				modalShow: false,
				content: '地址地址地址',
				query: {
					saleVO: {
						searchDateVo: {
							endDate: '',
							startDate: ''
						},
						transCompany: ''
					},
				},
				bList: [],
				horizontal: 'right',
				content: [{
					iconPath: '/static/images/tabbar/home.png',
					selectedIconPath: '/static/images/tabbar/home-sel.png',
					text: '地址配置',
					active: false
				}]
			}
		},
		created() {
			uni.hideHomeButton() //左上角HOME按钮
			// const id = uni.getStorageSync('transCompany')
			// const date = this.formatDate(new Date(), 'YYYY-MM-DD')
			// this.query.saleVO.searchDateVo.startDate = date + ' 00:00:00'
			// this.query.saleVO.searchDateVo.endDate = date + ' 23:59:59'
			// this.query.saleVO.transCompany = id
			// this.range = date
			// this.getShopList()
			// this.getAllList()
		},
		methods: {
			sectionChange(index) {
				this.current = index
				this.bList = []
				if (index == 0) {
					this.getAllList()
				}
				if (index == 1) {
					this.getList()
				}
				if (index == 2) {
					this.getReturnList()
				}
			},
			trigger(e) {
				// console.log(e)
				// this.content[e.index].active = !e.item.active
				//e.item.text
				uni.navigateTo({
					url: `/pages/other/logisticsAddress`
				})
			},
			getList() {
				this.tui.request('/app/sale/listAll', 'post', {
					remarkSR: 2,
					shopId: this.shopId,
					searchDateVo: this.query
				}, false, false, false).then(res => {
					if (res.code !== 200) return
					this.bList = res.result
				})
			},
			getAllList() {
				this.tui.request('/app/sale/listAll', 'post', {
					remarkSR: 2,
					shopId: this.shopId,
					searchDateVo: this.query
				}, false, false, false).then(res => {
					if (res.code !== 200) return
					this.bList = res.result.saleList
				})
			},
			getReturnList() {
				this.tui.request('/app/sale/listAll', 'post', {
					remarkSR: 3,
					shopId: this.shopId,
					searchDateVo: this.query
				}, false, false, false).then(res => {
					if (res.code !== 200) return
					this.bList = res.result.returnSaleList
				})
			},
			dateChange() {
				this.query.startDate = this.range[0]
				this.query.endDate = this.range[1]
				this.sectionChange(this.current)
			},
			gotoInfo() {
				uni.navigateTo({
					url: `/pages/index/shopInfo`
				})
			},


			gotoSearchData() {
				uni.navigateTo({
					url: '/pages/other/logisticsDetail'
				})
			},
			getShopList() {
				const that = this
				uni.request({
					url: tui.interfaceUrl() + '/app/sale/listCompany',
					data: this.query.saleVO,
					header: {
						'content-type': 'application/json',
						'appWLToken': tui.getToken()
					},
					method: 'post',
					dataType: 'json',
					success: (res) => {
						that.shopList = res.data.result
					},
					fail: (res) => {
						tui.toast("网络不给力，请稍后再试~")
					}
				})
			},
			onCellClick(item) {
				this.modalShow = true
				this.content = item.receiveAddress
			},
			onDatePackerChange(date) {
				if (!date) {
					this.query.saleVO.searchDateVo.startDate = ''
					this.query.saleVO.searchDateVo.endDate = ''
				} else {
					this.query.saleVO.searchDateVo.startDate = date + ' 00:00:00'
					this.query.saleVO.searchDateVo.endDate = date + " 23:59:59"
				}
				this.getShopList()
			},
			formatDate(date, fmt) {
				var o = {
					'M+': date.getMonth() + 1, //月份
					'D+': date.getDate(), //日
					'H+': date.getHours(), //小时
					'm+': date.getMinutes(), //分
					's+': date.getSeconds(), //秒
					'q+': Math.floor((date.getMonth() + 3) / 3), //季度
					'S': date.getMilliseconds() //毫秒
				};
				if (/(Y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
				for (var k in o)
					if (new RegExp('(' + k + ')').test(fmt))
						fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k])
							.length)));
				return fmt;
			}
		}
	}
</script>

<style lang="scss" scoped>
	button {
		color: #ffffff;
		background: #5fd9ee;
		width: 90%;
		margin: 20rpx auto;
	}

	.example-body {}

	.shop-choose {
		padding: 25upx 15upx;
		display: flex;
		justify-content: space-between;
		align-items: center;

		.shop-name {
			flex-basis: 150upx;
		}
	}

	.item-wrapper {
		background-color: #fff;
		overflow: hidden;
	}

	.text {
		width: 600upx;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	.contentPadding {
		padding: 0 20upx;
		background-color: #fff;
		color: #909399;

		.title {
			padding-left: 20rpx;
			font-size: 32rpx;
			color: #303133;
			line-height: 66rpx;

			image {
				display: inline-block;
				width: 40rpx;
				vertical-align: middle;
			}

			.btn {
				text-align: right;
				width: 24%;
				float: right;
				font-size: 26rpx;
				color: $u-primary;
			}
		}

		.grid-text {
			font-size: 28rpx;
			margin-bottom: 26rpx;
		}
	}
</style>