<template>
	<view>
		<view class="group_head">
			<view class="group_item">
				<view>员工姓名</view>
				<view class="text">{{info.name}}</view>
			</view>
			<view class="group_item">
				<view>手机号</view>
				<view class="text">{{info.mobile}}</view>
			</view>
			<view class="group_item">
				<view>加入时间</view>
				<view class="text">{{info.createtime}}</view>
			</view>
		</view>
		<!-- 标签栏 -->
		<view class="group_tab"> 
			<u-tabs name="cate_name" :list="list" :is-scroll="false" active-color="#008EFF" :current="current"
				@change="change" @click="changeTab"></u-tabs>
			<view class="processing_title" v-if="current == 0">
				<base-info v-if="info && info.id && active==0" :info="info"></base-info>
			</view>
			<view class="processing_title" v-if="current == 1">
				<customer-list v-if="customerList.length != 0 && active == 1" :customerList="customerList"></customer-list>
			</view>
			<view class="processing_title" v-if="current == 2">
				<achieve-ment v-if="active == 2" :achievementObj="achievementObj" :dataTime="dataTime" @changeDate="changeDate"></achieve-ment>
			</view>
		</view>
		<view style="height:100rpx"></view>
		<!-- 底部导航栏 -->
		<view class="bottom_nav">
			<view class="bottom_item" @click="jumpEdit">
				<image :src="BASE_IMG_URL+'clus_edit.png'" class="botimg" mode=""></image>
				<view>编辑信息</view>
			</view>
			<view class="bottom_item" @click="toCall">
				<image :src="BASE_IMG_URL+'edit_call.png'" class="botimg" mode=""></image>
				<view>拨打电话</view>
			</view>
			<view class="bottom_item" @click="DisabledAccount">
				<image :src="BASE_IMG_URL+'edit_jinyong.png'" class="botimg" mode=""></image>
				<view>禁用帐号</view>
			</view>
		</view>
	</view>
</template>

<script>
	import baseInfo from './baseInfo.vue'
	import customerList from './customerList.vue'
	import achieveMent from './achievement.vue'
	import { getNowData } from '@/util/weekTime.js'
	import { BASE_IMG_URL } from '@/util/api.js'
	import { netStaffDetail, netStaffofCustomerList, netStaffAchievement, netDisableAccount } from '@/api/index.js'
	
	export default{
		components:{
			baseInfo,
			customerList,
			achieveMent
		},
		data(){
			return{
				BASE_IMG_URL:BASE_IMG_URL,
				active:0,
				id:'',   //员工 id
				info:{},
				page:1,
				totalPage:1,
				limit:10,
				customerList:[],
				dataTime:'',
				achievementObj:{},
				current: 0,
				list: [
					{
						name: '基本信息',
						status: 0
					}
				],
			}
		},
		onLoad(options) {
			this.id = options.id
			
			//客户列表
			this.customerList = []
			this.page = 1
			this.totalPage = 1
			this.getCustomerList()
			//业绩统计
			this.dataTime = getNowData().substr(0,7)
			this.getData()
		},
		onShow() {
			this.getInfo()
		},
		onReachBottom() {
			if(this.page >= this.totalPage){
				return
			}
			this.page ++
			this.getCustomerList()
		},
		methods:{
			change(index) {
				this.current = index;
			},
			tabs_change(e) {
				this.current = e;
				this.mescroll.resetUpScroll();
			},
			changeTab(e) {
				this.active = e.detail.index
			},
			//员工 信息
			getInfo() {
				netStaffDetail({id:this.id}).then(res=>{
					this.info = res.data
				})
			},
			//客户列表
			getCustomerList() {
				let params = {
					id:this.id,
					limit:this.limit,
					page:this.page
				}
				netStaffofCustomerList({id:this.id}).then(res=>{
					this.customerList = [...this.customerList,...res.data.data]
					this.totalPage = res.data.last_page
				})
			},
			//业绩 统计
			getData() {
				let params = {
					id:this.id,
					date: this.dataTime
				}
				netStaffAchievement(params).then(res=>{
					this.achievementObj = res.data
				})
			},
			changeDate(date) {
				this.dataTime = date
				this.getData()
			},
			jumpEdit() {
				uni.navigateTo({
					url:'/pagesA/profile/staff/stafflist/editStaff?id='+this.id
				})
			},
			toCall() {
				// #ifdef MP-ALIPAY
				dd.showCallMenu({
				    phoneNumber: this.info.mobile, 
				    code: '+86'
				})
				// #endif
				// #ifndef MP-ALIPAY || APP-PLUS
				uni.makePhoneCall({
					phoneNumber: this.info.mobile
				})
				// #endif
				// #ifdef APP-PLUS
				plus.device.dial(this.info.mobile, true);
				// #endif
			},
			//禁用帐号
			DisabledAccount() {
				netDisableAccount({id:this.info.id}).then(res=>{
					uni.showToast({
						title:res.msg,
						icon:'none'
					})
					setTimeout(()=>{
						uni.navigateBack({
							delta:1
						})
					},2000)
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.group_head {
		display: flex;
		flex-wrap: wrap;
		padding: 20rpx 0;
		background-color: #fff;
		text-align: center;
		.group_item {
			width: 33.33%;
			color: #ccc;
			margin-bottom:15rpx;
			.text{
				line-height:48rpx;
				color: #999;
			}
			.group_htz{
				margin-top: 8rpx;
			}
		}
	}
	.group_tab {
		margin: 20rpx 0;
	}
	.bottom_nav {
		position: fixed;
		display: flex;
		bottom: 0;
		left: 0;
		right: 0;
		padding: 20rpx 0;
		background-color: #fff;
		text-align: center;
		color: #999;
		display: flex;
		justify-content: space-around;
		align-items: center;
		z-index: 9;
		border-top:1rpx solid #f5f5f5;
		.bottom_item {
			.botimg{
				width:40rpx;
				height:40rpx;
				margin-bottom:5rpx;
			}
		}
	}
</style>
