<template>
	<view class="page-container">
		<!-- 选项卡切换 -->
		<view class="tab-bar">
			<view class="nav-tab" :class="{ active: activeTab === 'isbn' }" @click="switchTab('isbn')">
				ISBN-上传
			</view>
<!-- 			<view class="nav-tab" :class="{ active: activeTab === 'title' }" @click="switchTab('title')">
				仅书名-上传
			</view> -->
			<view class="nav-tab" :class="{ active: activeTab === 'photo' }" @click="switchTab('photo')">
				无ISBN-上传
			</view>
		</view>
		<view class="form-content">
			<isbn-upload-form v-if="activeTab === 'isbn'" :selectedWarehouse="selectedWarehouse" ref="isbnUploadForm"></isbn-upload-form>
			<!-- <title-upload-form v-if="activeTab === 'title'" :selectedWarehouse="selectedWarehouse"></title-upload-form> -->
			<photo-upload-form v-if="activeTab === 'photo'" :selectedWarehouse="selectedWarehouse" ref="photoUploadForm"></photo-upload-form>
		</view>
	</view>
</template>
<script>
	import IsbnUpload from '@/pages/isbn-upload/index.vue'
	import titleUpload from '@/pages/title-upload/index.vue'
	import photoUpload from '@/pages/photo-upload/index.vue'

	export default {
		components: {
			'isbn-upload-form': IsbnUpload,
			'title-upload-form': titleUpload,
			'photo-upload-form': photoUpload,
		},
		options: {
			enablePullDownRefresh: true,
			backgroundTextStyle: 'dark'
		},
		data() {
			return {
				currentTab: 'isbn',
				activeTab: 'isbn', // 默认选中ISBN上传
				selectedWarehouse: '',
			}
		},
		created() {
			// 页面加载时获取仓库数据
			this.selectedWarehouse = uni.getStorageSync("selectedWarehouse") || null;
		},
		onShow() {
			// 每次页面显示时都重新获取仓库
			this.selectedWarehouse = uni.getStorageSync("selectedWarehouse") || null;
		},
		async onLoad() {
			// const cookiesResponse = await this.getCookies("18904056801", "Long6166@")
			// console.log(cookiesResponse.cookies.PHPSESSID)
			// uni.setStorageSync('cookies', cookiesResponse.cookies.PHPSESSID);
			// console.log('Cookies已保存到本地存储', cookiesResponse.cookies.PHPSESSID);
		},
		methods: {
			switchTab(tab) {
				this.activeTab = tab
				this.selectedWarehouse = uni.getStorageSync("selectedWarehouse") || null;
			},
			// 纯浏览器端 JavaScript 实现
			async getCookies(username, password) {
				try {
					// 第一步：先发送一个GET请求获取初始会话Cookie
					const initResponse = await this.uniRequestPromise({
						url: 'https://login.kongfz.com/Pc/Login/account',
						method: 'GET'
					});

					// 提取初始响应中的Cookie
					const initCookies = this.extractCookiesFromHeaders(initResponse.header);
					// 第二步：发送登录请求，携带用户名和密码
					const loginData = {
						loginName: username,
						loginPass: password
					};

					const loginResponse = await this.uniRequestPromise({
						url: 'https://login.kongfz.com/Pc/Login/account',
						method: 'POST',
						data: loginData,
						header: {
							'Content-Type': 'application/x-www-form-urlencoded',
							'Cookie': this.formatCookieHeader(initCookies)
						}
					});

					// 提取登录响应中的Cookie
					const loginCookies = this.extractCookiesFromHeaders(loginResponse.header);

					// 合并所有Cookie
					const allCookies = {
						...initCookies,
						...loginCookies
					};

					// 检查登录是否成功（根据实际返回判断）
					const isLoginSuccess = this.checkLoginSuccess(loginResponse.data);

					return {
						success: isLoginSuccess,
						cookies: allCookies,
						responseData: loginResponse.data // 包含服务器返回的原始数据
					};

				} catch (error) {
					console.error('登录请求失败:', error);
					return {
						success: false,
						error: error.message || '登录请求发生错误'
					};
				}
			},
			/**
			 * 将 uni.request 转换为 Promise 形式
			 */
			uniRequestPromise(options) {
				return new Promise((resolve, reject) => {
					uni.request({
						...options,
						success: (res) => resolve(res),
						fail: (err) => reject(err)
					});
				});
			},

			/**
			 * 从响应头中提取 Cookies
			 */
			extractCookiesFromHeaders(headers) {
				const cookies = {};
				const cookieHeaders = headers['Set-Cookie'] || headers['set-cookie'];

				if (!cookieHeaders) return cookies;

				// 处理可能是数组或字符串的 Cookie 头
				const cookieList = Array.isArray(cookieHeaders) ?
					cookieHeaders : [cookieHeaders];

				cookieList.forEach(cookieStr => {
					// 提取 cookie 名值对（忽略路径、过期时间等属性）
					const cookieParts = cookieStr.split(';')[0].split('=');
					if (cookieParts.length >= 2) {
						cookies[cookieParts[0].trim()] = cookieParts[1].trim();
					}
				});

				return cookies;
			},

			/**
			 * 将 Cookie 对象格式化为请求头字符串
			 */
			formatCookieHeader(cookies) {
				return Object.entries(cookies)
					.map(([key, value]) => `${key}=${value}`)
					.join('; ');
			},

			/**
			 * 检查登录是否成功（根据实际接口返回调整）
			 */
			checkLoginSuccess(responseData) {
				// 这里需要根据实际返回的数据结构判断登录是否成功
				// 示例：假设返回包含 success: true 或 code: 200
				if (responseData.success === true || responseData.code === 200) {
					return true;
				}

				// 默认返回 false
				return false;
			},
			async onPullDownRefresh() {
				console.log('父组件触发下拉刷新');
				try {
					// 获取当前活动的组件引用
					let currentComponent;
					if (this.activeTab === 'isbn') {
						currentComponent = this.$refs.isbnUploadForm;
						console.log('找到ISBN组件引用:', !!currentComponent);
					} else if (this.activeTab === 'photo') {
						currentComponent = this.$refs.photoUploadForm;
						console.log('找到Photo组件引用:', !!currentComponent);
					}
					
					// 如果找到组件并且组件有resetData方法，则调用它
					if (currentComponent && typeof currentComponent.resetData === 'function') {
						console.log('开始调用子组件resetData方法');
						
						// 等待resetData方法完成
						await currentComponent.resetData();
						
						// 确保视图更新
						await this.$nextTick();
						
						console.log('子组件resetData方法调用完成，强制更新视图');
						currentComponent.$forceUpdate();
						
						uni.showToast({
							title: '刷新成功',
							icon: 'success',
							duration: 1500
						});
					} else {
						console.error('找不到子组件或resetData方法不存在');
						if (currentComponent) {
							console.log('子组件可用方法:', Object.keys(currentComponent).filter(key => typeof currentComponent[key] === 'function'));
						}
						
						// 如果找不到方法，尝试直接访问子组件的数据并重置
						if (currentComponent) {
							if (this.activeTab === 'isbn') {
								console.log('尝试直接重置ISBN组件数据');
								// 直接重置ISBN组件的关键数据
								currentComponent.scanResult = '';
								currentComponent.formData = {
									isbn: '',
									sku: '',
									title: '',
									art_no: '',
									more: '',
									bookName: '',
								};
								currentComponent.value4 = 1.00; // 重置价格
								currentComponent.value3 = 1; // 重置库存
								currentComponent.fileList1 = [];
								currentComponent.uploadedImages = [];
								
								// 重置市场标签
								currentComponent.marketTags = [{
										label: '在售:',
										value: 0
									},
									{
										label: '旧:',
										value: 0
									},
									{
										label: '新:',
										value: 0
									},
									{
										label: '已售:',
										value: 0
									}
								];
								
								// 重置品相选择
								if (currentComponent.$refs.conditionSelect && 
									typeof currentComponent.$refs.conditionSelect.resetSelection === 'function') {
									currentComponent.$refs.conditionSelect.resetSelection();
								}
								
								// 重置在售商品列表
								if (currentComponent.$refs.onSaleProductsComponent) {
									currentComponent.$refs.onSaleProductsComponent.updateProducts([]);
								}
								
								// 强制更新视图
								await this.$nextTick();
								currentComponent.$forceUpdate();
								console.log('直接重置完成');
							}
						}
						
						uni.showToast({
							title: '刷新成功',
							icon: 'success',
							duration: 1500
						});
					}
				} catch (error) {
					console.error('刷新失败:', error);
					uni.showToast({
						title: '刷新失败',
						icon: 'none',
						duration: 1500
					});
				} finally {
					// 停止下拉刷新动画
					setTimeout(() => {
						uni.stopPullDownRefresh();
					}, 500);
				}
			},
		}
	}
</script>
<style scoped>
	.tab-container {
		padding: 20rpx;
	}

	.tab-bar {
		display: flex;
		border-radius: 10rpx;
		overflow: hidden;
		background-color: #ffffff;
		box-shadow: 0 2rpx 6rpx rgba(0, 0, 0, 0.05);
		margin-bottom: 20rpx;
	}

	.nav-tab {
		flex: 1;
		text-align: center;
		padding: 20rpx 0;
		font-size: 28rpx;
		color: #333333;
		transition: all 0.3s;
	}

	.nav-tab.active {
		background-color: #e6f7ff;
		color: #2979ff;
	}
</style>