<template>
	<view>
		<!-- 头部 -->
		<cu-custom bgColor="bg-blue" :isBack="true">
			<block slot="backText">智能查阅</block>
			<block slot="content"></block>
			<block slot="right">
				<view class=" flex justify-center" >
				 	<button @click="search()"  class="margin-top-ssm  cu-btn round line-blue text-white">
						<image class="login-img" src="/static/index/search-white.png"></image>搜索
					</button>
				</view>
			</block>
		</cu-custom>
		<scroll-view scroll-y="true" style="margin-bottom: 300rpx;">
			<view v-for="(item,index) in treeData" :key="item.id" class="treeData_b">
				<view class="treeData_1" @click="treeTap(index+1,item)">
					<view style="font-weight: bold;font-size: 34rpx;" :class="item.selected?'indexColor':''">{{item.name}}</view>
					<view v-if="item.children.length>0">
						<image src="/static/information/shang.png" style="width: 40rpx;height: 40rpx;vertical-align: middle;" v-if="show == index + 1"></image>
						<image src="/static/information/xia.png" style="width: 40rpx;height: 40rpx;vertical-align: middle;" v-if="show != index + 1 || show == 0"></image>
					</view>
				</view>
				<view v-for="(second,seconds) in item.children" :key="second.id" v-if="show == index + 1">
					<view class="treeData_1s treeData_2" @click="secondTap(seconds + 1,second)">
						<view :class="second.selected?'indexColor':''">{{second.name}}</view>
						<view v-if="second.children.length>0">
							<image src="/static/information/shang.png" style="width: 40rpx;height: 40rpx;vertical-align: middle;" v-if="showsecond == seconds + 1"></image>
							<image src="/static/information/xia.png" style="width: 40rpx;height: 40rpx;vertical-align: middle;" v-if="showsecond != seconds + 1 || showsecond == 0"></image>
						</view>
					</view>
					<view v-if="showsecond == seconds + 1" :style="{'padding-bottom': second.children.length>0 ? '22rpx':''}">
						<view v-for="(three,threes) in second.children" :key="three.id" class="treeData_three">
							<view class="treeData_1s treeData_3" @click="threeTap(threes + 1,three)">
								<view :class="three.selected?'indexColor':''">{{three.name}}</view>
								<view v-if="three.children.length>0">
									<image src="/static/information/shang.png" style="width: 40rpx;height: 40rpx;vertical-align: middle;" v-if="showthree == threes + 1"></image>
									<image src="/static/information/xia.png" style="width: 40rpx;height: 40rpx;vertical-align: middle;" v-if="showthree != threes + 1 || showthree == 0"></image>
								</view>
							</view>
							<view v-if="showthree == threes + 1" v-for="(four,fours) in three.children" :key="four.id">
								<view class="treeData_1s treeData_3" @click="fourTap(fours + 1,four)">
									<view style="padding-left: 22rpx;" :class="four.selected?'indexColor':''"><text style="margin-right: 10rpx;">◈</text>{{four.name}}</view>
									<view v-if="four.children.length>0">
										<image src="/static/information/shang.png" style="width: 40rpx;height: 40rpx;vertical-align: middle;" v-if="showfour == fours + 1"></image>
										<image src="/static/information/xia.png" style="width: 40rpx;height: 40rpx;vertical-align: middle;" v-if="showfour != fours + 1 || showfour == 0"></image>
									</view>
								</view>
								<view v-if="showfour == fours + 1" v-for="(five,fives) in four.children" :key="five.id">
									<view class="treeData_1s treeData_3" @click="fiveTap(fives + 1,five)">
										<view style="padding-left: 44rpx;" :class="five.selected?'indexColor':''"><text style="margin-right: 10rpx;">➣</text>{{five.name}}</view>
										<view v-if="five.children.length>0">
											<image src="/static/information/shang.png" style="width: 40rpx;height: 40rpx;vertical-align: middle;" v-if="showfive == fives + 1"></image>
											<image src="/static/information/xia.png" style="width: 40rpx;height: 40rpx;vertical-align: middle;" v-if="showfive != fives + 1 || showfive == 0"></image>
										</view>
									</view>
									<view v-if="showfive == fives + 1" v-for="(six,sixs) in five.children" :key="six.id">
										<view class="treeData_1s treeData_3" @click="sixTap(sixs + 1,six)">
											<view style="padding-left: 66rpx;" :class="six.selected?'indexColor':''"><text style="margin-right: 10rpx;">•</text>{{six.name}}</view>
											<view v-if="six.children.length>0">
												<image src="/static/information/shang.png" style="width: 40rpx;height: 40rpx;vertical-align: middle;" v-if="showsix == sixs + 1"></image>
												<image src="/static/information/xia.png" style="width: 40rpx;height: 40rpx;vertical-align: middle;" v-if="showsix != sixs + 1 || showsix == 0"></image>
											</view>
										</view>
										<view v-if="showsix == sixs + 1" v-for="(seven,sevens) in six.children" :key="seven.id">
											<view class="treeData_1s treeData_3" @click="sevenTap(sevens + 1,seven)">
												<view style="padding-left: 88rpx;" :class="seven.selected?'indexColor':''">{{seven.name}}</view>
											</view>
										</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</scroll-view>
		
		<!-- 底部-->
		<view v-if="modalShow" class="shadow foot" style="background-color: #0A8CD5;color: #fff;position: fixed; z-index: 999; bottom: 0;width: 100%;padding-bottom: calc(var(--window-bottom) + 15px);">
			<view class="padding-sm solid-bottom-type" style="display: flex;align-items: center;position: absolute;left: 0;right: 0;top: -80rpx;height: 80rpx;opacity: 0.9;background-image: linear-gradient(#91C9E8, #0A8CD5);box-shadow: 0px -1px 2px #D0D0D0;">
				<image class="login-img" src="/static/index/label.png"></image>	
				<view style="overflow-x: scroll;width: 680rpx;margin-left: 16rpx;">
					<view class="text-white" style="white-space : nowrap;font-weight: bold;">{{path}}</view>
				</view>
			</view>
			<view class="padding-sm flex justify-between" @click="navTo()" style="margin-top: 16rpx;">	
				<view v-for="(item,index) in fileType" :key="index">
					<image v-if="item==1" class="menuImageTask margin-right-sm" src="/static/task/excel.png"></image>
					<image v-if="item==2" class="menuImageTask margin-right-sm" src="/static/task/word.png"></image>
				    <image v-if="item==3" class="menuImageTask margin-right-sm" src="/static/task/pdf.png"></image>
					<image v-if="item==4" class="menuImageTask margin-right-sm" src="/static/task/image.png"></image> 
				</view>	
				<view class="margin-top-sm">
					<text class="text-white text-xl" >共{{fileData.length}}个文件</text>
				</view>
				<view class="margin-top-sm">
					<text class="cuIcon-right margin-left" style="font-size: 26px;"></text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				treeData: [],
				modalShow:false,
				show: 0, //一级状态
				showsecond: 0, //二级状态
				showthree: 0, //三级状态
				showfour: 0, //四级状态
				showfive: 0, //五级状态
				showsix: 0, //六级状态
				showseven: 0, //七级状态
				path:"",
				chooseData:[],
				fileData:[],
				fileType:[],
			}
		},
		onLoad(e) {
			var projectId = uni.getStorageSync("porject"+"_"+uni.getStorageSync("userInfo").id).id;
			if(e.value){//扫码进行的
			   projectId = e.value.split(",")[1];
			   this.findDataProgress(projectId,0);	
			}else{
			  this.findDataProgress(projectId,1);
			}
			
		},
		methods: {
			search(){
				uni.setStorageSync("pageType",4);//区分搜索页面跳转
				if(this.treeData!=''){
					uni.setStorageSync("fileId",this.treeData[0].id)
					uni.navigateTo({
						url:"/pages/search/search"
					})
				}else{
					this.$prompt.none("暂无数据，不可搜索")
				}
				
			},
			findDataProgress(projectId,type) {
				var that = this;
				that.http.request('/app/divideClient/findDataByProjectId', {
					projectIdOrFileID: projectId,
					type:type
				}).then((result) => {
					if (result.data!= null) {
						that.treeData = result.data.children;
						/* that.text(that.treeData); */
					}else{
						that.$prompt.none(result.msg);
					}
				})
			
			},
			filterNode(value, data) {
				if (!value) return true;
				return data.label.indexOf(value) !== -1;
			},
			handleNodeClick(obj) {
				var that=this;
				that.fileData=[];
				that.fileType=[];
				that.modalShow=false;
				that.http.request("/app/divideClient/findFile",{nodeId:obj.id}).then((res)=>{
					if(res.datas.length!=0){
						that.fileData=res.datas;
						that.fileData.forEach((item)=>{
							that.fileType.push(item.fileType);
						});
						that.fileType = that.unique(that.fileType);	
						that.findNodePath(obj.id);
					}else{
						that.$prompt.none("该节点没有文件");
						that.modalShow=false;	
					}
				})
				this.chooseData = obj;
			},
			findNodePath(id){
				var that=this;
				that.http.request("/app/divideClient/selectNodeTreeByFile",{id:id}).then((res)=>{
					that.path="";
					res.datas.forEach((item)=>{
						if(item.parentId!=0){
							that.path += " / "+item.name;
						}
					})
					that.modalShow=true;
				})
			},
			// 数组去重
			unique(arr){
			　　let hash=[];
			　　for (let i = 0; i < arr.length; i++) {
			　　　　if(hash.indexOf(arr[i]) === -1){
			　　　　　　hash.push(arr[i]);
			　　　　}
			 　  }
			      return hash;
			},
			navTo(){
				uni.navigateTo({
					url:"/pages/documentList/documentList?title="+this.path+"&id="+this.chooseData.id
				})
			},
			treeTap(e,r) {
				this.text(this.treeData)
				r.selected = true;
				if (this.show == e) {
					this.show = 0
				} else {
					this.show = e
				}
				this.handleNodeClick(r);
			},
			secondTap(e,r) {
				this.text(this.treeData)
				r.selected = true;
				if (this.showsecond == e) {
					this.showsecond = 0
				} else {
					this.showsecond = e
				}
				this.handleNodeClick(r);
			},
			threeTap(e,r) {
				this.text(this.treeData)
				r.selected = true;
				if (this.showthree == e) {
					this.showthree = 0
				} else {
					this.showthree = e
				}
				this.handleNodeClick(r);
			},
			fourTap(e,r) {
				this.text(this.treeData);
				this.$set(r,"selected",true);
				if (this.showfour == e) {
					this.showfour = 0
				} else {
					this.showfour = e
				}
				this.handleNodeClick(r);
			},
			fiveTap(e,r) {
				this.text(this.treeData);
				this.$set(r,"selected",true);
				if (this.showfive == e) {
					this.showfive = 0
				} else {
					this.showfive = e
				}
				this.handleNodeClick(r);
			},
			sixTap(e,r) {
				this.text(this.treeData)
				r.selected = true;
				if (this.showsix == e) {
					this.showsix = 0
				} else {
					this.showsix = e
				}
				this.handleNodeClick(r);
			},
			sevenTap(e,r) {
				this.text(this.treeData)
				r.selected = true;
				if (this.showseven == e) {
					this.showseven = 0
				} else {
					this.showseven = e
				}
				this.handleNodeClick(r);
			},
			text(data) {
				var that = this;
				data.forEach((item) => {
					item.selected = false;
					if (item.children.length > 0) {
						that.text(item.children);
					}
			
				})
				that.treeData  = data;
			}
		}
	}
</script>

<style>
   .solid-bottom-type {
     	border-bottom: 1upx solid white;
   }
   .solid-bottom-btn {
     	border: 1upx solid white;
   }
   .treeData_b {
		margin: 12rpx 22rpx 0;
		background-color: #fff;
		border-radius: 10rpx;
		padding: 0 22rpx;
   }
   
   .treeData_1 {
		font-size: 30rpx;
		color: #101010;
		height: 88rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
   }
   
   .treeData_1s {
		font-size: 30rpx;
		color: #101010;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 22upx 0;
		min-height: 88rpx;
   }
   
   .treeData_2 {
		border-top: 1upx dashed #E3E1E1;
   }
   
   .treeData_3 {
		border-top: 1upx dashed #E3E1E1;
   }
   
   .treeData_three {
		background-color: #F7F7F7;
		padding: 0 22rpx;
		border-radius: 10rpx;
		margin-bottom: 22;
   }
   
   .treeData_three:first-child {
		border-radius: 10rpx 10rpx 0 0;
   }
   
   .treeData_three:last-child {
		border-radius: 0 0 10rpx 10rpx;
   }
   
   .indexColor {
		color: #0A8CD5;
		font-weight: bold;
   }
   .padding-sm{
	   padding:20rpx 22rpx;
	}
</style>
