zhgdyunapp/pages/areaTree/areaTree.vue

<template>
	<view class="areaTreePage">
		<scroll-view scroll-y="true" class="pageContent">
			<headers :showBack="pageType=='video'?false:true">
				<view class="headerName">
					{{headerName}}
				</view>
			</headers>
			<view class="areaTreeBox">
				<view class="uni-form-item">
					<input class="uni-input" name="projectName" v-model="projectName" @input="searchFile"
						placeholder="请输入项目名称" />
					<button class="mini-btn" type="primary" size="mini" @click="loadData">搜索</button>
				</view>
				<template v-if="mapData.length > 0">
					<tree-menu :pageType="pageType" :iconShow="true" v-for="(item,index) in mapData" :key="item.companyId" :item="item"
						:expandedIndex="index" :treeIndex="treeIndex" @clickItem="clickTreeItem"></tree-menu>
				</template>
			</view>
		</scroll-view>
		<footers v-if="pageType=='video' || pageType=='backend'" :activeTab="pageType=='video' ? 'videoManage': 'menu'"></footers>
	</view>
</template>

<script>
	import footers from "../../components/footers/footers.vue"
	import uniIcons from "@/components/uni-icons/uni-icons.vue"
	import TreeMenu from '@/components/tree-node/areaIndex.vue'
	import headers from "../../components/headers/headers.vue"
	export default {
		components: {
			footers,
			TreeMenu
		},
		data() {
			return {
				projectName: '',
				searchsn: '',
				userInfo: null,
				mapData: [],
				headerName: '集团',
				pageType: 'video',
				treeIndex: 1, // 树形层级index
			};
		},
		onLoad(options) {
			console.log(options.type)
			if (options.type && options.type != undefined && options.type != 'undefined') {
				this.pageType = options.type
			}
			// uni.setStorageSync('pageType',this.pageType)
		},
		mounted() {
			this.userInfo = JSON.parse(uni.getStorageSync('userInfo'))
			this.initData(true);
		},
		methods: {
			clickTreeItem(item) {
				this.viewVideoListFn(item)
			},
			searchFile(e) {
				this.projectName = e.detail.value
			},
			viewVideoListFn(item) {
				if (this.pageType == 'video') {
					uni.navigateTo({
						// url: '../videoManage/videoList?sn=' + item.projectSn
						url: '../videoManage/videoGroup?sn=' + item.projectSn
					})
				} else if (this.pageType == 'markRoom') {
					uni.setStorageSync('projectDetail', JSON.stringify({
						projectSn: item.projectSn,
						projectName: item.projectName
					}))
					uni.navigateTo({
						url: '../projectEnd/markRoom/markRoom?sn=' + item.projectSn + '&projectName=' + item
							.projectName
					})
				} else if (this.pageType == 'backend' && item.projectSn) {
					uni.setStorageSync('projectDetail', JSON.stringify(item))
					// if(this.userInfo.styleType==1){
					uni.navigateTo({
						url: '../projectEnd/projectIndex/projectIndex?sn=' + item.projectSn + '&projectName=' +
							item.projectName
					})
					// }else{
					// 	uni.redirectTo({
					// 		url: '/pages/workstation/workstationIndex/workstationIndex?sn='+item.projectSn+'&projectName='+item.projectName
					// 	})
					// }

				}

			},
			initData(type) {
				var that = this
				switch (that.userInfo.accountType) {
					case 2:
						this.searchsn = that.userInfo.headquartersSn
						break;
					case 3:
						this.searchsn = that.userInfo.sn
						break;
					case 4:
						this.searchsn = that.userInfo.sn
						break;
					case 5:
						this.searchsn = that.userInfo.sn
						break;
					case 7:
						this.searchsn = that.userInfo.sn
						break;
				}
				this.loadData(type);

			},
			//获取所有企业下区域数据
			loadData(type) {
				//type：true代表第一调用
				var that = this
				this.sendRequest({
					url: "xmgl/company/getComapnyStatisticsList",
					data: {
						sn: that.searchsn,
						projectName: that.projectName,
						showVideoNum: 1,
						standardType: that.pageType == 'markRoom' ? 1 : 0
					},
					method: "POST",
					success(res) {
						if (res.code == 200) {
							that.mapData = res.result.companyList ? res.result.companyList : res.result.projectList
							console.log(88488, that.mapData)
							if (res.result.companyInfo) {
								that.headerName = res.result.companyInfo.companyName
							}
						}
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.statusBox {
		display: inline-flex;
		align-items: center;

		.icon-status {
			margin-left: 16rpx;
		}
	}

	.areaTreePage {
		background-color: white;
		height: 100%;
		color: $uni-text-color;
	}

	// .areaTreeBox{
	// 	padding: 0 20rpx;
	// }
	.areaInner {
		border-bottom: 1px solid rgba(221, 221, 221, 0.67);
	}

	.areaTitle {
		font-size: 30rpx;
		border-bottom: 1px solid rgba(221, 221, 221, 0.67);
		padding: 20rpx 30rpx;
	}

	.arrow {
		float: right;
		opacity: 0.7;
	}

	.areaTitle2 {
		font-size: 14px;
		padding: 20rpx 30rpx 20rpx 30px;
	}

	.projectTitle {
		font-size: 14px;
		padding: 20rpx 30rpx 20rpx 30px;
	}

	.projectTitle2 {
		padding-left: 100rpx;
	}

	.projectBox {
		background-color: rgba(221, 221, 221, 0.26);
	}

	.uni-input {
		border-radius: 30rpx;
		margin: 20rpx 20rpx;
		background-color: #f2f2f2;
		height: 60rpx;
		line-height: 60rpx;
		padding: 0 40rpx;
		font-size: 28rpx;
		width: 65%;
	}

	.uni-form-item {
		position: relative;
	}

	.mini-btn {
		position: absolute;
		right: 30rpx;
		top: 50%;
		transform: translateY(-50%);
		border-radius: 30rpx;
		height: 60rpx;
		line-height: 60rpx;
	}
</style>