<template>
	<view class="warpper">
		<qnHeader class="header">
			<!-- <view class="header"> -->
			<view class="header-title">客户详情</view>
			<view class="right-title">客户授信</view>
			<!-- </view> -->
		</qnHeader>
		<view>
			<uni-segmented-control :current="current" :values="items" @clickItem="onClickItem" styleType="text" activeColor="#007AFF"></uni-segmented-control>
			
				<view class="content">
					<view v-show="current === 0"><basicInformation ref="basicInformationRef" :customerId="customerId"></basicInformation></view>
					<view v-show="current === 1"><equipmentInformation></equipmentInformation></view>
					<view v-show="current === 2"><basePaperDeals></basePaperDeals></view>
					<view v-show="current === 3"><wastePaperTrading></wastePaperTrading></view>
				</view>
			
		</view>
	</view>
</template>

<script>
import qnHeader from '@/components/qn-header/qn-header.vue'
import basicInformation from './basic-information.vue'
import equipmentInformation from './equipment-information.vue'
import basePaperDeals from './base-paper-deals.vue'
import wastePaperTrading from './waste-paper-trading.vue'

export default {
	components: {
		qnHeader,
		basicInformation,
		equipmentInformation,
		basePaperDeals,
		wastePaperTrading
	},
	data() {
		return {
			current: 0,
			items: ['基础信息', '设备信息', '原纸交易', '废纸交易'],
			customerId: null,
			
		}
	},
	onLoad(option) {
		this.customerId = option.id || '800890'
		this.$nextTick(() => {
			this.$refs.basicInformationRef.getBaseInfo()
		})
	},
	methods: {
		onClickItem(e) {
			console.log('e', e)
			this.current = e.currentIndex
		},
	}
}
</script>

<style lang="scss" scoped>
.warpper {
	.header {
		justify-content: space-between;
	}
	.header-title {
		font-size: 36rpx;
		color: #000000;
		letter-spacing: 0;
		text-align: center;
		font-weight: 500;
	}

	.right-title {
		font-size: 28rpx;
		color: #007aff;
		text-align: center;
		line-height: 40rpx;
		font-weight: 500;
	}
}
</style>
