<template>
	<view class="container">
		<block v-for="(item, index) in detailData">
			<view>
				<view class="details">
					<u-image
						width="140rpx"
						height="200rpx"
						:src="
							item.picUrl.split('http').length > 1
								? item.picUrl
								: baseUrl + item.picUrl
						"
						class="img"
					></u-image>
					<view class="right">
						<view class="name">{{ item.goodsName }}</view>
						<view class="tag">
							<block
								v-for="(item1, index1) in item.specifications?.length"
								:key="index1"
							>
								<u-tag
									:text="item.specifications[index1]"
									type="info"
									size="mini"
									style="margin: 8rpx 8rpx 8rpx 0;"
								/>
							</block>
						</view>
						<text
							style="display: flex; justify-content: flex-end; color: #969799; font-size: 12px;"
						>
							x{{ item.number }}
						</text>
					</view>
				</view>
				<u-line v-if="detailData.length > 1" color="#e8e8e8" />
			</view>
		</block>
		<view class="content-footer">
			<u-button
				shape="circle"
				type="error"
				size="mini"
				style="margin-right: 30;"
				@tap="toIndex"
			>
				返回首页
			</u-button>
			<view>
				<u-button shape="circle" size="mini" @tap="generateQuote">生成报价</u-button>
				<u-button shape="circle" size="mini" style="margin-left: 20rpx;" @tap="download">
					下载pdf
				</u-button>
			</view>
		</view>
	</view>
	<view style="height: 100rpx;"></view>
	<view class="footer">
		<text>商品总价：￥{{ totlePirce }}</text>
		<text>含税商品总价：￥{{ taxTotlePirce }}</text>
	</view>
</template>

<script setup lang="ts">
import { ref, computed } from 'vue';
import { onLoad, onBackPress } from '@dcloudio/uni-app';
import { orderDetail } from '@/api/index';
import { quotationInit } from '@/api/cart';
import { getProductLineIndex } from '@/api/productLine';
import { useStore } from '@/store/useStore';
import config from '@/utils/config';

let store = useStore();
let baseUrl = config.baseUrl;
let enclosure = ref(''); // pdf key值
let detailData = ref([] as any);
let type = ref();
let orderId = ref();
let tax = ref(0); // 税率

onLoad((options: any) => {
	type.value = options.type;
	orderId.value = options.orderId;
	console.log(type.value, 'type.value');
	initOrderData(options.orderId);
});

// 返回首页
let toIndex = () => {
	uni.reLaunch({
		url: '../index/index',
		success() {
			if (type.value === 'productline') {
				store.$reset(); // 重置pinia数据
			}
		},
	});
};

// 生成报价
let generateQuote = () => {
	// let data = [] as any;
	// let flag = true;
	// detailData.value.map((item: any) => {
	// 	if (typeof item.unitPrice === 'undefined') {
	// 		flag = false;
	// 		return uni.showToast({
	// 			title: `请填写 ${item.goodsName} 单价`,
	// 			icon: 'none',
	// 		});
	// 	} else
	// 		data.push({
	// 			goodsName: item.goodsName,
	// 			unitPrice: item.unitPrice,
	// 		});
	// });
	// if (flag)
	// 	uni.navigateTo({
	// 		url: `../order/quotation?orderId=${orderId.value}`,
	// 	});
	uni.navigateTo({
		url: `../order/quotation?orderId=${orderId.value}&lineId=${lineId.value}`,
	});
};

// 总价格
let totlePirce: any = computed(() => {
	let totlePic = 0;
	if (detailData.value) {
		detailData.value.map((item: any) => {
			if (typeof item.unitPrice !== 'undefined') {
				totlePic += Number(item.unitPrice);
			}
		});
	}
	return totlePic.toFixed(2);
});

// 含税总价格
let taxTotlePirce = computed(() => {
	let taxTotlePic = Number(totlePirce.value) + Number(totlePirce.value) * tax.value * 0.01;
	return Number(taxTotlePic).toFixed(2);
});

// 下载pdf
let download = () => {
	uni.showLoading({
		title: '正在请求数据',
	});
	uni.request({
		url: baseUrl + '/wx/storage/download/' + enclosure.value,
		responseType: 'arraybuffer',
		success: (res: any) => {
			uni.hideLoading();
			if (res.data) {
				let blob = new Blob([res.data]);
				let downloadElement = document.createElement('a');
				let href = window.URL.createObjectURL(blob); //创建下载的链接
				downloadElement.href = href;
				downloadElement.download = enclosure.value + '.pdf'; //下载后文件名
				document.body.appendChild(downloadElement);
				downloadElement.click(); //点击下载
				document.body.removeChild(downloadElement); //下载完成移除元素
				window.URL.revokeObjectURL(href); //释放掉blob对象
			}
		},
		fail(err: any) {
			console.log(err);
		},
	});
};

let initQuotationInit = (orderId: number) => {
	quotationInit({ orderId }).then((res: any) => {
		console.log(res, '产品线');
	});
};

let lineId = ref();
// 获取goodsId
let initOrderData = (orderId: number) => {
	orderDetail({ orderId }).then((res: any) => {
		if (res.data.code === 200) {
			enclosure.value = res.data.data.orderInfo.enclosure;
			res.data.data.orderGoods.map((item: any, i: number) => {
				if (res.data.data.orderGoods.length - 1 === i) {
					lineId.value = item.goodsId;
					initProductLineIndex(item.goodsId);
				}
			});
		}
	});
};

// 通过goodsId查询产品线数据
let initProductLineIndex = (lineId: number) => {
	getProductLineIndex({ lineId }).then((res: any) => {
		if (res.data.code === 200) {
			detailData.value = [...res.data.data.cartList, ...detailData.value];
			console.log(res, 'lineId');
		}
	});
};

// 通过type判断返回页面
onBackPress((options: any) => {
	if (type.value === 'productline') {
		if (options.from === 'navigateBack') {
			return false;
		}
		uni.switchTab({
			url: './productLine',
			success() {
				store.$reset(); // 重置pinia数据
				let pages = getCurrentPages(); //获取所有页面的数组对象
				let currPage: any = pages[pages.length - 1]; //当前页面
				uni.reLaunch({
					url: '/' + currPage.route,
				});
			},
		});
		return true;
	} else if (type.value === 'productLineCart') {
		if (options.from === 'navigateBack') {
			return false;
		}
		uni.switchTab({
			url: '../cart/index',
			success() {
				let pages = getCurrentPages(); //获取所有页面的数组对象
				let currPage: any = pages[pages.length - 1]; //当前页面
				uni.reLaunch({
					url: '/' + currPage.route,
				});
			},
		});
		return true;
	}
});
</script>

<style lang="scss" scoped>
.container {
	box-sizing: border-box;
	margin: 16rpx 32rpx;
	background-color: #fff;
	.details {
		width: 100%;
		padding: 16rpx 32rpx;
		display: flex;
		flex-direction: row;
		justify-content: flex-start;
		align-items: center;
		.img {
			margin-right: 20rpx;
		}

		.tag {
			margin-top: 1%;
			display: flex;
			flex-direction: row;
			flex-wrap: wrap;
			margin-bottom: 5%;
		}

		.right {
			width: 80%;

			.sum-price {
				display: flex;
				justify-content: space-between;
			}
		}
	}

	.content-footer {
		margin-top: 50rpx;
		padding: 50rpx;
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
}

.footer {
	position: fixed;
	bottom: 0;
	z-index: 99;
	width: 100%;
	height: 100rpx;
	background-color: #fff;
	padding: 0 32rpx;
	line-height: 100rpx;
	font-size: 30rpx;
	font-weight: 600;
	display: flex;
	justify-content: space-between;
}
</style>
