<template>
	<view class="type-num-select mg-lr-24">
		<view class="car-brand u-f u-f-jcfs u-f-aic mg-bot-16">
			<image :src="carData.logo" class="mg-right-20"></image>
			<text>{{carData.name}}</text>
		</view>
		<view class="tab-list u-f  mg-bot-28">
			<view :class="['item fs26 light-black', activeTab == 'allCar' ? 'active' : '']"
				@click="handleTab('allCar')">全部车型</view>
			<view :class="['item fs26 light-black', activeTab == item.year ? 'active' : '']"
				v-for="(item,index) in carBrandTab" :key="index" @click="handleTab(item.year)">{{item.year}}</view>
		</view>
		<view class="tab-content">
			<view class="tc-list" v-for="(item,index) in carBrand" :key="index">
				<common-title :msg="item.year"></common-title>
				<view class="light-black fs26" style="padding-top: 20rpx;padding-bottom: 20rpx;"
					v-for="(ite,ind) in item.children" :key="ite.id" @click="jumpToCarInfo(ite,item.year)">{{ite.name}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	import commonTitle from "../.././components/common-title/common-title.vue"
	export default {
		components: {
			commonTitle
		},
		data() {
			return {
				activeTab: 'allCar',
				filterTabContent: [],
				carData: '',
				carBrand: [],
				carBrandTab: [],
				vehicleBrandId: '',
				fatype: "",
				formData: {}
			}
		},

		onLoad(options) {
			let data = JSON.parse(decodeURIComponent(options.data))
			this.formData = options.formData ? JSON.parse(decodeURIComponent(options.formData)) : {}
			console.log(data, 'options')
			// console.log(options,'options');
			this.carData = data
			this.vehicleBrandId = options.vehicleBrandId
			this.fatype = options.fatype
			this.getCarBrandYearList()
			// this.getCarDetails()
		},

		methods: {

			//获取车型年份
			getCarBrandYearList() {
				console.log(this.carData.id);
				this.$http.get('/api/client/vehicle/carBrandInfoList', {
					carBrandId: this.carData.id,
					year: this.activeTab == 'allCar' ? '' : this.activeTab
				}).then(res => {
					this.carBrand = res.data.data
				})
				this.$http.get('/api/client/vehicle/carBrandInfoList', {
					carBrandId: this.carData.id,
				}).then(res => {
					this.carBrandTab = res.data.data
				})
			},

			handleTab(year) {
				this.activeTab = year;
				this.getCarBrandYearList()
				// if (this.activeTab !== 'allCar')  {
				// 	console.log("year", year)
				// 	// this.filterTabContent = this.tabContnt.filter(item => item.id == id)
				// 	console.log("this.tabContnt", this.tabContnt)
				// } else {
				// 	this.filterTabContent = this.tabContnt
				// }
			},
			jumpToCarInfo(item,year) {
				console.log(item);
				let data = {
					brandLogo: item.logo,
					vehicleBrand: this.carData.vehicleBrand,
					vehicleModel: this.carData.name,
					vehicleBrandId: this.vehicleBrandId,
					vehicleModelId: this.carData.id,
					vehicleConfigId: item.id,
					vehicleConfig: item.name,
					// vehicleAge: year,
					
				}
				console.log(data);
				console.log(this.fatype, 'fatype');
				if (!this.fatype) {
					uni.navigateTo({
						url: '/pagesE/car-info/car-info?data=' + encodeURIComponent(JSON.stringify(data))
					})
				} else if (this.fatype == 99) {
					// 首页二手车
					uni.reLaunch({
						url: '/pagesA/ershou-car/ershou-car?formData=' + encodeURIComponent(JSON.stringify(this
							.formData)) + '&data=' + encodeURIComponent(JSON.stringify(data))
					})
				} else if (this.fatype == 98) {
					// 首页保险救援
					const pages = getCurrentPages();
					const targetPath = '/pagesA/insurance-rescue/insurance-rescue';
					const index = pages.findIndex(page => page.$page.fullPath.includes(targetPath));
					console.log(index);
					if (index !== -1) {
						let newArr = data ? [data.vehicleBrand, data.vehicleModel, data.vehicleConfig] : []
						const prevPage = pages[index];
						// this.formData.vehicleAge = year
						prevPage.$vm.FormData = this.formData
						prevPage.$vm.FormData.vehicleInformation = newArr.join(',')
						// prevPage.$vm.receiveParam(param);
						console.log('prevPage.$vm',prevPage.$vm);
						uni.navigateBack({
							delta: pages.length - index - 1
						})
					} else {
						uni.navigateBack()
						console.log('没有找到指定路径');
					}
					console.log('pages',pages);
					// uni.reLaunch({
					// 	url: '/pagesA/insurance-rescue/insurance-rescue?formData=' + encodeURIComponent(JSON
					// 		.stringify(this.formData)) + '&data=' + encodeURIComponent(JSON.stringify(data))
					// })
				}

			}
		},
		mounted() {
			this.filterTabContent = this.tabContnt
		}
	}
</script>

<style lang="scss" scoped>
	.type-num-select {
		margin-bottom: 74rpx;

		image {
			width: 108rpx;
			height: 80rpx;
		}

		.tab-list {
			flex-wrap: wrap;

			.item {
				text-align: center;
				padding: 10rpx 20rpx;
				background: #FFFFFF;
				border-radius: 8rpx 8rpx 8rpx 8rpx;
				border: 1rpx solid #D9D9D9;
				margin-right: 10rpx;
				margin-bottom: 10rpx;

				// &:nth-child(4n) {
				// 	margin-right: 0;
				// }
				&.active {
					color: #FF4502;
					border: 1rpx solid #FF4502;
				}
			}
		}
	}
</style>