<template>
	<view class="page">
		<view class="title">{{i18n.dingdantongji}}</view>
		<view class="tababr row">
			<view @click="changeindex(index)" v-for="(item,index) in tab" :key="index" class="tab"
				:class="selectedIndex == index ? 'tabs':'tabn'">{{item}}</view>
		</view>
		<scroll-view scroll-y :style="'height:' + scrollH + 'px;'" class="scroll" @scrolltolower="scrolltolower">
			<view v-for="(item,index) in monthlist" :key="index" @tap='gotomapdetail(item)' style="position: relative;"
				class="monthcell column">
				<view @tap.stop='total("call",item)'
					style="position: absolute;right:20px;top: 10px;font-size: 14px;border: 1px solid #eee;color:chocolate;padding: 5px 10px;">
					联系方式
				</view>
				<view class="row month">订单号：{{item.orderId}}
					<!-- <view v-if="index == 0" class="detailtime">{{item.orderAddress}}</view> -->
				</view>
				<view class="row month">完成时间：{{item.updateTime}}
					<!-- <view v-if="index == 0" class="detailtime">{{item.orderAddress}}</view> -->
				</view>
				<view class="row month">店铺名：{{item.shopName}}
					<!-- <view v-if="index == 0" class="detailtime">{{item.orderAddress}}</view> -->
				</view>
				<view class="row month">取：{{item.getOrderAddress}}
					<!-- <view v-if="index == 0" class="detailtime">{{item.orderAddress}}</view> -->
				</view>
				<view class="row month">送：{{item.companyName}}
					<!-- <view v-if="index == 0" class="detailtime">{{item.orderAddress}}</view> -->
				</view>
				<view @tap.stop='total("detail",item)'
					style="position: absolute;right:20px;bottom: 15px;font-size: 14px;border: 1px solid #eee;color:blue;padding: 5px 10px;">
					查看详情
				</view>
			</view>
		</scroll-view>
		<!-- 详情弹窗 -->
		<uni-popup ref="detailPopup" background-color="#fff">
			<view class="popup-content">
				<view style="width: 100%;">
					<view class="close-text" @click="$refs.detailPopup.close()">关闭</view>
				</view>
				<view class="">
					<view class="row month">订单号：{{detailData.orderId}}
						<!-- <view v-if="index == 0" class="detailtime">{{item.orderAddress}}</view> -->
					</view>
					<view class="row month">完成时间：{{detailData.updateTime}}
						<!-- <view v-if="index == 0" class="detailtime">{{item.orderAddress}}</view> -->
					</view>
					<view class="row month">店铺名：{{detailData.shopName}}
						<!-- <view v-if="index == 0" class="detailtime">{{item.orderAddress}}</view> -->
					</view>
					<view class="row month">取：{{detailData.getOrderAddress}}
						<!-- <view v-if="index == 0" class="detailtime">{{item.orderAddress}}</view> -->
					</view>
					<view class="row month">送：{{detailData.companyName}}
						<!-- <view v-if="index == 0" class="detailtime">{{item.orderAddress}}</view> -->
					</view>
					<view class="row month">物流图片：（长按保存）
						<!-- <view v-if="index == 0" class="detailtime">{{item.orderAddress}}</view> -->
					</view>
					<view class="row month">
						<img :src="detailData.orderPicture" @longpress="saveImg(detailData.orderPicture)" alt=""
							style="width:240px;height: 240px;background-size: 100%;" />
						<!-- <view v-if="index == 0" class="detailtime">{{item.orderAddress}}</view> -->
					</view>
				</view>
			</view>
		</uni-popup>
		<!-- 打电话弹窗 -->
		<uni-popup ref="callPopup" background-color="#fff">
			<view class="popup-content" style="width:400rpx;height: auto;">
				<view style="width: 100%;">
					<view class="close-text" @tap="$refs.callPopup.close()">关闭</view>
					<view style="width: 100%;margin-top:50rpx;text-align: center;font-size: 40rpx;">您要拨打的电话？</view>
				</view>
				<view style="display: flex;width: 95%;margin: 100rpx auto 10rpx; ">
					<button @click="connect('dCall')" class="call-btn">店铺</button>
					<button @click="connect('wCall')" class="call-btn">物流</button>
				</view>
			</view>
		</uni-popup>
		<view>
			蓝牙状态：{{printStatus?'已连接':'未连接'}}
		</view>
		<view @click="closePrint" style="width:100rpx;height: 150rpx;background:#000;margin-left: 50px;color:#fff;">断开连接
		</view>
		<view style="width:100rpx;height: 150rpx;background:#000;">
			<kk-printer ref="kkprinter" :bufferData="bufferData" :printNum="printNum"
				:defaultText="defaultText" @statusChange="statusChange"></kk-printer>
		</view>
	</view>
</template>

<script>
	import cell from '../../components/ordercell/index.vue'
	import util from '@/components/kk-printer/utils/util.js';
	import * as blesdk from '@/components/kk-printer/utils/bluetoolth.js';
	import kkPrinter from '@/components/kk-printer/index.vue';
	export default {
		components: {
			cell,
			kkPrinter
		},
		computed: {
			i18n() {
				return this.$t('index')
			},
		},
		data() {
			return {
				bufferData: [],
				printNum: 1,
				defaultText: '连接蓝牙',
				p: 1,
				centerarray: ['完成订单', '已抢订单', '配送里程'],
				selectedIndex: 0,
				selectedIndex2: 0,
				tab: ['今日订单', '月订单'],
				tab2: ['全部', '已完成', '已转单'],
				scrollH: 0,
				list: [],
				info: '',
				monthlist: [],
				totalPages: 0,
				callData: {},
				detailData: {},
				printStatus: false
			}
		},
		onReady() {
			this.centerarray = [
				this.i18n.order.wanchengOrder,
				this.i18n.order.yiqiangOrder,
				this.i18n.order.peisonglicheng
			]
			this.tab = [this.i18n.order.jinriOrder, this.i18n.order.yuedingdan]
			this.tab2 = [this.i18n.eva.quanbu, this.i18n.order.yiwancheng, this.i18n.order.yizhuandan]
		},
		onLoad(option) {
			var that = this
			if (option.index) {
				this.selectedIndex2 = option.index
			}
			this.scrollH = getApp().globalData.windowHeight - getApp().globalData.top - 44 - 395

			this.getlist()



			//根据缓存查看蓝牙连接状态
			this.printStatus = uni.getStorageSync('deviceId') ? true : false
		},
		methods: {
			statusChange(){
				this.printStatus = true;
			},
			//关闭蓝牙连接，删除deviceId缓存
			closePrint() {
				if(this.printStatus){
					uni.removeStorageSync('deviceId')
					this.printStatus = false
					uni.showToast({
						title: "蓝牙已断开",
						icon: 'success'
					})
				}else{
					uni.showToast({
						title: "蓝牙已断开",
						icon: 'success'
					})
				}
			},
			saveImg(path) {
			
				uni.saveImageToPhotosAlbum({
					filePath: path,
					success: () => {
						uni.showToast({
							title: "保存成功",
							icon: 'success'
						})
					},
					fail: () => {
						uni.showToast({
							title: "保存失败",
							icon: 'none'
						})
					}
				})
			},
			total(type, item) {

				if (type == 'detail') {
					this.detailData = item;
					this.$refs.detailPopup.open()
				} else if (type == 'call') {
					this.callData = item;
					this.$refs.callPopup.open()
				}

			},
			//联系
			connect(type) {
				var phone;
				if (type == 'dCall') {
					phone = this.callData.mobile + ''
				} else {
					phone = this.callData.transCompanyPhone + ''
				}
				uni.makePhoneCall({
					phoneNumber: phone,
					success: (res) => {

					},
					// 失败回调
					fail: (res) => {
						console.log('调用失败!', JSON.stringify(res))
					}
				})
			},
			gotomapdetail(item) {
				// uni.navigateTo({
				// 	url: '../detailmap/index?oid=' + item.id,
				// });
				this.$refs.detailPopup.open()
			},
			getlist() {
				const today = new Date();
				// 获取当前时间(today)的年份
				const year = today.getFullYear();
				// 获取月份
				const month = String(today.getMonth() + 1).padStart(2, '0');
				// 获取当前日
				const day = String(today.getDate()).padStart(2, '0');
				// 得到年月日
				const thisDayDate = `${year}-${month}-${day}`; //打印当前日期

				var that = this
				
				// const Accesstoken = uni.getStorageSync('Accesstoken')
				// const baseUrl = getApp().globalData.mainurl
				// uni.request({
				// 	url: baseUrl + '/order/ow/getAllByCondition',
				// 	data: {
				// 		workerName: uni.getStorageSync('userinfo').workerName,
				// 		orderStatus: 4,
				// 		pageNumber: 1,
				// 		pageSize: 10,
				// 		startDate: thisDayDate,
				// 		endDate: thisDayDate
				// 	},
				// 	method:'POST',
				// 	header: {
				// 		"content-type": 'application/json',
				// 		Accesstoken:Accesstoken
				// 	}, // 请求头
				// 	success: function(res) {
				// 		console.log('测试',res)
				// 	},
				// 	fail: function(err) {
				// 		console.log(err)
				// 		uni.hideLoading();
				// 	}
				// })
				this.NB.sendRequest('/order/ow/getOrderList', {
					workerName: uni.getStorageSync('userinfo').workerName,
					orderStatus: 4,
					pageNum: that.p,
					pageSize: 10,
					startDate: that.selectedIndex == 1 ? year + '-' + month + '-' + '01' : thisDayDate,
					endDate: thisDayDate,
				}, false, 'POST', "application/json").then(data => {
					
					if (that.selectedIndex == 0) {
						that.monthlist = data.result.content
					} else {
						for (let i = 0; i < data.result.content.length; i++) {
							that.monthlist.push(data.result.content[i])
						}

					}

					this.totalPages = data.result.totalPages
				})
			},
			scrolltolower() {
				if (this.p < this.totalPages) {
					this.p = parseInt(this.p) + 1;
					this.getlist()
				}

			},
			fomatFloat(value, n) {
				var f = Math.round(value * Math.pow(10, n)) / Math.pow(10, n);
				var s = f.toString();
				var rs = s.indexOf('.');
				if (rs < 0) {
					s += '.';
				}
				for (var i = s.length - s.indexOf('.'); i <= n; i++) {
					s += "0";
				}
				return s;
			},
			changeindex(index) {
				this.selectedIndex = index
				if (index == 0) {
					this.scrollH = getApp().globalData.windowHeight -
						getApp().globalData.top - 44 - 395
				} else {
					this.scrollH = getApp().globalData.windowHeight -
						getApp().globalData.top - 44 - 110

					var that = this
					// this.NB.sendRequest('Rider.Orders.GetMonthCount', {
					// 	year: 0
					// }).then(data => {
					// 	console.log(data)
					// 	that.monthlist = data.info
					// 	for (let i = 0; i <that.monthlist.length; i++) {
					// 		if (that.monthlist[i].distance > 1000){
					// 			that.monthlist[i].distancekm = that.fomatFloat(that.monthlist[i].distance/1000,1)
					// 			that.$set(that.monthlist,i,that.monthlist[i])
					// 		}
					// 	}
					// 	that.$forceUpdate()
					// })
				}
				this.getlist()
			},
			changeindex2(index) {
				this.selectedIndex2 = index
				this.p = 1;
				this.getlist()
			},
		}
	}
</script>

<style>
	@import url("./index.css");
</style>