<template>
	<view class="warpper">
		<customHeader>
			<view class="header-title">
				客户详情
			</view>
			<view class="right-title">
				客户授信
			</view>
		</customHeader>
		<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></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 customHeader from './custom-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: {
			customHeader,
			basicInformation,
			equipmentInformation,
			basePaperDeals,
			wastePaperTrading
		},
		data() {
			return {
				current: 0,
				items: ['基础信息', '设备信息', '原纸交易', '废纸交易']
			}
		},
		methods: {
			onClickItem(e) {
				console.log('e', e)
				this.current = e.currentIndex
			}
		}
	}
</script>

<style lang="scss" scoped>
	.warpper {
		.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>
