<template>
	<view class="control">
		<view class="control-list">
			<view class="control-item">
				<view class="item-title b-bottom" v-if="info.securityConstructionSchemeFile && JSON.parse(info.securityConstructionSchemeFile).length>0">
					安全专项施工方案附件
				</view>
				<view class="item-select-box b-bottom flex a-center j-between b-bottom"
					v-for="(item,index) in JSON.parse(info.securityConstructionSchemeFile)"
					:key="index"
					@click="previewFile(item)">
					<view class="img-box">
						<!-- <image v-if="item.iconType == 'word'" src="../../../static/word.png"></image>
						<image v-if="item.iconType == 'excel'" src="../../../static/excel.png"></image>
						<image v-if="item.iconType == 'pdf'" src="../../../static/pdf.png"></image>
						<image v-if="item.iconType == 'ppt'" src="../../../static/ppt.png"></image>
						<image v-if="item.iconType == 'image'" src="../../../static/icon-image.png"></image> -->
						<image v-if="item.iconType.includes('word')" src="../../../static/word.png"></image>
						<image v-if="item.iconType.includes('excel')" src="../../../static/excel.png"></image>
						<image v-if="item.iconType.includes('pdf')" src="../../../static/pdf.png"></image>
						<image v-if="item.iconType.includes('ppt')" src="../../../static/ppt.png"></image>
						<image v-if="item.iconType.includes('image')" src="../../../static/icon-image.png"></image>
					</view>
					<view class="item-content">{{item.name}}</view>
					<uni-icons type="arrowright"></uni-icons>
				</view>
			</view>
			<view class="control-item" v-if="info.specialConstructionSchemeFile && JSON.parse(info.specialConstructionSchemeFile).length>0">
				<view class="item-title b-bottom">
					专项施工方案附件
				</view>
				<view class="item-select-box b-bottom flex a-center j-between b-bottom"
					v-for="(item,index) in JSON.parse(info.specialConstructionSchemeFile)"
					:key="index"
					@click="previewFile(item)">
					<view class="img-box">
						<!-- <image v-if="item.iconType == 'word'" src="../../../static/word.png"></image>
						<image v-if="item.iconType == 'excel'" src="../../../static/excel.png"></image>
						<image v-if="item.iconType == 'pdf'" src="../../../static/pdf.png"></image>
						<image v-if="item.iconType == 'ppt'" src="../../../static/ppt.png"></image>
						<image v-if="item.iconType == 'image'" src="../../../static/icon-image.png"></image> -->
						<image v-if="item.iconType.includes('word')" src="../../../static/word.png"></image>
						<image v-if="item.iconType.includes('excel')" src="../../../static/excel.png"></image>
						<image v-if="item.iconType.includes('pdf')" src="../../../static/pdf.png"></image>
						<image v-if="item.iconType.includes('ppt')" src="../../../static/ppt.png"></image>
						<image v-if="item.iconType.includes('image')" src="../../../static/icon-image.png"></image>
					</view>
					<view class="item-content">{{item.name}}</view>
					<uni-icons type="arrowright"></uni-icons>
				</view>
			</view>
			<view class="control-item" v-if="info.technicalDisclosureFile && JSON.parse(info.technicalDisclosureFile).length>0">
				<view class="item-title b-bottom">
					技术交底文件
				</view>
				<view class="item-select-box b-bottom flex a-center j-between"
					v-for="(item,index) in JSON.parse(info.technicalDisclosureFile)"
					:key="index"
					@click="previewFile(item)">
					<view class="img-box">
						<!-- <image v-if="item.iconType == 'word'" src="../../../static/word.png"></image>
						<image v-if="item.iconType == 'excel'" src="../../../static/excel.png"></image>
						<image v-if="item.iconType == 'pdf'" src="../../../static/pdf.png"></image>
						<image v-if="item.iconType == 'ppt'" src="../../../static/ppt.png"></image>
						<image v-if="item.iconType == 'image/png'" src="../../../static/icon-image.png"></image> -->
						<image v-if="item.iconType.includes('word')" src="../../../static/word.png"></image>
						<image v-if="item.iconType.includes('excel')" src="../../../static/excel.png"></image>
						<image v-if="item.iconType.includes('pdf')" src="../../../static/pdf.png"></image>
						<image v-if="item.iconType.includes('ppt')" src="../../../static/ppt.png"></image>
						<image v-if="item.iconType.includes('image')" src="../../../static/icon-image.png"></image>
					</view>
					<view class="item-content">{{item.name}}</view>
					<uni-icons type="arrowright"></uni-icons>
				</view>
			</view>
		</view>
		<view class="no-data" v-if="showNoData">
			<image class="img" src="/static/noData.png"></image>
			<text class="txt">暂无数据</text>
		</view>
	</view>
</template>

<script>
	export default {
		props:['info'],
		data(){
			return{
				showNoData: false
			}
		},
		created(){
			console.log(this.info,777888)
			if((!this.info.securityConstructionSchemeFile || JSON.parse(this.info.securityConstructionSchemeFile).length == 0) && (!this.info.specialConstructionSchemeFile || JSON.parse(this.info.specialConstructionSchemeFile).length == 0) && (!this.info.technicalDisclosureFile || JSON.parse(this.info.technicalDisclosureFile).length == 0)){
				this.showNoData = true;
			}
		},
		methods:{
			previewFile(val){
				let url = this.url_config + 'image/' + val.url
				console.log(val)
				if(val.iconType == "image"){
					uni.previewImage({
						urls: [url]
					})
				} else{
					uni.downloadFile({
					  url: url,
					  success: function (res) {
					    var filePath = res.tempFilePath;
					    uni.openDocument({
					      filePath: filePath,
					      success: function (res) {
					        console.log('打开文档成功');
					      }
					    });
					  }
					});
				}
				// //#ifdef H5
				// 	uni.showToast({
				// 	    title: '暂不支持预览！',
				// 		icon: "none",
				// 		duration: 2000
				// 	});
				// 	return;
				// //#endif
			}
		}
	}
</script>

<style lang="scss" scoped>
	.control{
		padding-top: 20rpx;
		padding-bottom: 40rpx;
		.flex{
			display: flex;
		}
		.j-between{
			justify-content: space-between;
		}
		.a-center{
			align-items: center;
		}
		.b-bottom{
			border-bottom: 1px solid #F6F6F6;
		}
		.control-h2{
			font-size: 14px;
			height: 60rpx;
			padding: 0 20rpx;
			background: rgba(255,255,255,0.5);
		}
		.control-list{
			font-size: 14px;
			.control-item{
				padding: 0 20rpx;
				margin-bottom: 20rpx;
				background: #fff;
				.item-title{
					font-weight: 600;
					height: 72rpx;
					line-height: 72rpx;
				}
			}
			.item-select-box{
				padding: 30rpx 0;
				.item-content{
					width: 100%;
				}
				.img-box{
					width: 100rpx;
					height: 100rpx;
					margin-right: 20rpx;
					uni-image{
						width: 100%;
						height: 100%;
					}
				}
				
			}
			
		}
		.no-data{
			text-align: center;
			.img{
				display: block;
				height: 200rpx;
				width: 200rpx;
				margin: 0 auto;
				margin-top: 60rpx;
				margin-bottom: 60rpx;
			}
			.txt{
				color: #C0C4CC;
			}
		}
	}
</style>
