<route lang="json5" type="page">
	{
	layout: 'default',
	style: {
	navigationStyle: 'custom',
	navigationBarTitleText: '三册',
	},
	}
</route>
<template>
	<PageLayout navTitle="三册查看">
		<wd-col-picker label="选择目录" v-model="selectedValue" :columns="dataSource" :column-change="columnChange"
			@confirm="handleConfirm" :display-format="displayFormat"></wd-col-picker>
		<iframe id="bdIframe" :src="fileUrl" ref="bdIframe" style="border: none;" class="iframe" v-if="fileUrl" />
		<view v-if="fileUrl2" class="bdIframe" @click="onlinePreview(item.path)" v-for="(item, i) in fileUrl2" style="padding: 15px 0 0 0">
			<wd-card :title="item.name"></wd-card>
		</view>
		<view v-else style="padding: 20px;">
			未获取到文件信息，请选择其他目录!
		</view>
	</PageLayout>
</template>

<script setup>
	import {
		useUserStore
	} from '@/store/user'
	import {
		getListApi,
		getJobDesIdByDepAndName,
		getPathByInsflagQuote,
		queryByIdApi
	} from '@/api/pages/sc'
	import {
		Base64
	} from 'js-base64'
	import base64 from '@/utils/code';
	import {
		getEnvBaseUrl
	} from '@/utils/index'
	const baseUrl = 'https://10.75.166.6/jeecg-boot/sys/common/static/';
	const data = ref([])
	const dataSource = ref([])
	const selectedValue = ref([]);
	const loading = ref(false);
	const path = ref('')
	const url = ref('')
	const fileUrl = ref('')
	const fileUrl2 = ref([])
	const columnChange = ({
		selectedItem,
		resolve,
		finish
	}) => {
		const areaData = findChildrenByCode(data.value, selectedItem.value)
		if (areaData && areaData.length) {
			resolve(
				areaData.map((item) => {
					return {
						value: item.value,
						label: item.text
					}
				})
			)
		} else {
			finish()
		}
	}

	const handleConfirm = ({
		value
	}) => {
		queryByIdApi(value[value.length - 1]).then(res => {
			let url = res.result.path
			let quote = res.result.quote
			let insFlag = res.result.insFlag
			if (url) {
				if (isH5()) {
					fileUrl.value = 'https://szcx.zyyt.sinopec.com/preview/onlinePreview?url=' + encodeURIComponent(
						Base64.encode(baseUrl + url))
				} else {
					fileUrl.value = 'https://szcx.zyyt.sinopec.com/preview/onlinePreview?url=' + encodeURIComponent(
						new base64().encode(baseUrl + url))
				}
			} else if (/^-?\d+$/.test(quote) && !insFlag) {
				getJobDesIdByDepAndName(quote).then((res) => {
					fileUrl.value = getEnvBaseUrl() + '/jmreport/view/929517863011811328?id=' + res
						.id +
						"&token=" + useUserStore().userInfo.token;
				})
			} else if (insFlag) {
				getPathByInsflagQuote({
					insFlag: insFlag,
					quote: quote
				}).then(res => {
					fileUrl.value = ''
					fileUrl2.value = res;
				})
			} else {
				fileUrl.value = ''
				fileUrl2.value = ''
			}
		})
	}

	const displayFormat = (selectedItems) => {
		if (selectedItems.length > 0) {
			return selectedItems[selectedItems.length - 1].label
		}
	}

	const getList = () => {
		getListApi().then(res => {
			data.value = res.result
			dataSource.value = [data.value.map(item => {
				return {
					value: item.value,
					label: item.text
				}
			})]
		});
	}

	const onlinePreview = (e) => {
		uni.navigateTo({
			url: `/pages/onlinePreview/detail?data=${e}`
		});
	};

	const findChildrenByCode = (data, code) => {
		if (!code) {
			return data
		}
		for (const item of data) {
			if (item.value === code) {
				return item.children || null
			}
			if (item.children) {
				const childrenResult = findChildrenByCode(item.children, code)
				if (childrenResult) {
					return childrenResult
				}
			}
		}
		return null
	}

	// 判断是否是 H5 环境
	const isH5 = () => {
		// #ifdef H5
		return true;
		// #endif
		// #ifndef H5
		return false;
		// #endif
	}

	onLoad(() => {
		getList();
	});
</script>
<style lang="scss">
	#bdIframe {
		height: calc(100vh - 230rpx);
		/* 使用视口高度减去顶部固定高度 */
		border: none;
		/* 移除absolute定位，改用普通文档流 */
		position: relative;
		top: 0;
	}
</style>