<template>
	<!-- 兼职中心 -->
	<view class="page1">
		<view class="title">
			<view class="title-sreach">
				<view class="back-btn" @tap="back" :style="{'top': menuButtonInfo.top +'px'}">
					<uni-icons type="left" size="28"></uni-icons>
				</view>
				<view class="title-name" :style="{'padding-top': menuButtonInfo.top +'px'}">
					兼职中心
				</view>
			</view>
		</view>
		<view class="shop-title">
			<view class="title1">
				<img src="https://ooo.0o0.ooo/2019/04/28/5cc5a71a6e3b6.png" alt="" />
			</view>
			<view class="title2">
				<view class="title22">
					<view style="display: flex;font-size: 32rpx;font-weight: 700;">
						{{worker.workerName}}
						<img v-if="isBaozhang"
							src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/d27fa14c6bb7426482ed7821919d3aa7.png"
							alt="" style="width: 140rpx;height: 32rpx;background-size: 100%;margin: 20rpx;">
						<img v-else
							src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/176715c0f8ea41e7a9be8fa1c3edd670.png"
							alt="" style="width: 140rpx;height: 32rpx;background-size: 100%;margin: 20rpx;">
					</view>
				</view>
				<view class="title33" @tap="goDetail('xx')">
					修改信息
					<uni-icons type="right" size="12"></uni-icons>
				</view>
			</view>
		</view>
		<view class="shop-order">
			<view class="order1">
				待办事项
			</view>
			<view class="order2">
				<view class="order22">

					<!-- <view class="order33" @tap="goDetail('db',4)">
						<view class="order44">
							{{daiquCount}}
						</view>
						<view class="order55">
							待取货
						</view>
					</view>
					<view class="order33" @tap="goDetail('db',5)">
						<view class="order44">
							{{daisongCount}}
						</view>
						<view class="order55">
							待送达
						</view>
					</view> -->
					<view class="order33" @tap="goDetail('tui',11)">
						<view class="order44">
							{{shouhouCount}}
						</view>
						<view class="order55">
							待退款/售后
						</view>
					</view>
					<view class="order33" @tap="goDetail('pj','cha')">
						<view class="order44">
							{{chapingCount}}
						</view>
						<view class="order55">
							待回复差评
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="shop-order">
			<view class="order1" style="display: flex;">
				<view style="flex: 1;">
					今日实时数据
				</view>
				<view @tap="goDetail('tj')">
					更多
					<uni-icons type="right" size="12"></uni-icons>
				</view>
			</view>
			<view class="data2">
				<view class="data22">
					<view class="data222">
						{{orderData.orderCount == undefined?0:orderData.orderCount}}
					</view>
					<view class="data333">
						完成订单
					</view>
				</view>
				<view class="data22">
					<view class="data222">
						{{orderData.amount == undefined ? 0 : orderData.amount}}
					</view>
					<view class="data333">
						配送佣金
					</view>
				</view>
			</view>
		</view>
		<view class="shop-order">
			<view class="order1">
				必备工具
			</view>
			<view class="menu2">

				<view class="menu22" @tap="goDetail('xx')">
					<view class="menu33">
						<img src="/static/images/dingdan/dd0.png" alt="" />
					</view>
					<view class="menu44">
						信息管理
					</view>
				</view>
				<view class="menu22" @tap="goDetail('dd')">
					<view class="menu33">
						<img src="/static/images/dingdan/dd1.png" alt="" />
					</view>
					<view class="menu44">
						订单管理
					</view>
				</view>
				<view class="menu22" @tap="goDetail('qb')">
					<view class="menu33">
						<img src="/static/images/dingdan/dd2.png" alt="" />
					</view>
					<view class="menu44">
						我的钱包
					</view>
				</view>
				<view class="menu22" @tap="goDetail('pj','')">
					<view class="menu33">
						<img src="/static/images/dingdan/dd3.png" alt="" />
					</view>
					<view class="menu44">
						顾客评价
					</view>
				</view>
				<view class="menu22" @tap="goDetail('ph','')">
					<view class="menu33">
						<img src="/static/images/dingdan/dd4.png" alt="" />
					</view>
					<view class="menu44">
						排行
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import base from '@/utils/ossUploadFile/base64.js';
	export default {
		data() {
			return {
				menuButtonInfo: {},
				worker: {},
				orderData: {},
				chapingCount: 0,
				shouhouCount: 0,
				daiquCount: 0,
				daisongCount: 0,
				isBaozhang: false
			}
		},
		onShow() {
			this.menuButtonInfo = uni.getMenuButtonBoundingClientRect()
			this.worker = uni.getStorageSync('worker')
			this.getData()
		},
		onLoad(option) {

		},
		methods: {
			getData() {
				this.tui.request("/mall/delivery/countOrderByStatusIndex", "POST", {workerId:uni.getStorageSync('worker').workerId,regionId:JSON.parse(uni.getStorageSync('area')).id}, false, true).then((res) => {
					if (res.code == 200) {
						if(res.result != null){
							for(let i = 0;i<res.result.length;i++){
								if(res.result[i].status == 1){
									this.daiquCount = Number(res.result[i].orderCount)
								}else if(res.result[i].status == 2){
									this.daisongCount = Number(res.result[i].orderCount)
								}else if(res.result[i].status == 3){
									this.shouhouCount = Number(res.result[i].orderCount)
								}else if(res.result[i].status == 4){
									this.chapingCount = Number(res.result[i].orderCount);
								}else{
									this.orderData = res.result[i].workerIndex
								}
							}
						}
						that.$forceUpdate();
					} else {
						that.tui.toast(res.message);
						return;
					}
					uni.hideLoading();
				}).catch((res) => {});
			},
			goDetail(type, index) {
				let url = ''
				switch (type) {
					case 'tj':
						url = '/package2/myCenter/dataStatistics'
						break;
					case 'db':
						url = '/package2/shop/shopOrderList?index=' + index
						break;
					case 'xx':
						url = '/package2/myCenter/partTimeJobRegister'
						break;
					case 'qb':
						url = ''
						break;
					case 'dd':
						url = '/package2/partTimeJob/workerOrderList'
						break;
					case 'ph':
						url = '/package2/shop/ranking'
						break;
					case 'tui':
						uni.navigateTo({
							url: '/package2/shop/afterService?type=worker'
						})
						break;
					case 'pj':
						let item = {
							shopScore: uni.getStorageSync('worker').score,
							id: uni.getStorageSync('worker').workerId
						}
						url = '/package2/group/shopEvaluate?item=' + JSON.stringify(item) + '&isMerchant=2&isCha=' + (
							index == 'cha' ? 1 : 0)
						break;
					default:
				}
				uni.navigateTo({
					url: url
				})
			},
			back() {
				uni.navigateBack()
			},
		}
	}
</script>

<style lang="scss">
	page {
		width: 100%;
		height: 100%;
		font-size: 24rpx;
		background: #F5F8F5;
		color: #00231C;
	}

	.page1 {
		width: 100%;
		height: 100%;
		font-size: 24rpx;
		position: relative;
	}

	.title {
		background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat;
		width: 100%;
		height: 20%;
	}

	.title-sreach {
		width: 100%;
		display: flex;
		height: 200rpx;
		position: relative;
	}

	.back-btn {
		position: absolute;
		bottom: 0;
		left: 0;
	}

	.title-name {
		padding-top: 110rpx;
		font-size: 36rpx;
		font-weight: 700;
		flex: 1;
		text-align: center;
	}

	.shop-title {
		width: 95%;
		margin: -130rpx auto 0;
		padding: 20rpx;
		background: #fff;
		border-radius: 20rpx;
		display: flex;
		font-size: 28rpx;
		font-weight: 700;
	}

	.title1 {
		width: 70rpx;
		height: 70rpx;

		img {
			width: 100%;
			height: 100%;
			border-radius: 10rpx;
		}
	}

	.title2 {
		flex: 1;
		line-height: 70rpx;
		display: flex;
	}

	.title22 {
		flex: 1;
		padding-left: 20rpx;
	}

	.shop-order {
		width: 95%;
		margin: 20rpx auto 0;
		background: #fff;
		border-radius: 20rpx;
		padding: 0 20rpx 0;
	}

	.order1 {
		height: 70rpx;
		line-height: 70rpx;
		font-size: 28rpx;
		font-weight: 700;
		border-bottom: 1px solid #eee;
	}

	.order22 {
		display: flex;
		height: 100rpx;
		padding-top: 20rpx;
	}

	.order33 {
		flex: 1;
		text-align: center;
	}

	.order44 {
		font-size: 28rpx;
		font-weight: 700;
	}

	.data2 {
		display: flex;
		height: 140rpx;
		text-align: center;
		padding-top: 20rpx;
	}

	.data22 {
		flex: 1;
	}

	.data222 {
		font-size: 36rpx;
		font-weight: 700;
		padding-bottom: 20rpx;
	}

	.menu2 {
		display: flex;
		flex-wrap: wrap;
		text-align: center;
		padding-top: 20rpx;
	}

	.menu22 {
		width: 25%;
		height: 120rpx;
	}

	.menu33 {
		img {
			width: 50rpx;
			height: 50rpx;
			background-size: 100%;
		}
	}

	.menu44 {
		height: 40rpx;
		line-height: 40rpx;
	}
</style>