Revert "feat: fullscreen page remove tabs"

This reverts commit d8bfcee2.

pages/details/details.vue

@@ -239,11 +239,37 @@
 							}
 						})
 					}
-					that.reportInfo = res.data.Result
+					that.reportInfo = this.handleTabsLink(res.data.Result)
 					uni.setStorageSync('reportInfo', JSON.stringify(res.data.Result))
 					that.getStickyTables()				
 				}
 			},
+			/**
+			* tabs 组件处理关联关系
+			*/
+			handleTabsLink(data) {
+				data.list.forEach(item => {
+				  if(item.type === 'NormalTabs' && (item.child.index.length || item.child.data.length)) {
+						if (item.child.index.length) {
+							item.child.index.forEach(child => {
+								const index = data.list.findIndex(i => i.id === child )
+								if(index != -1) {
+									data.list[index].linkTabsId = item.id
+								}
+							})
+						}
+						if (item.child.data.length) {
+							item.child.data.forEach(child => {
+								const index = data.list.findIndex(i => i.id === child.comp )
+								if(index != -1) {
+									data.list[index].linkTabsId = item.id
+								}
+							})
+						}
+				  }
+				})
+				return data
+			},
 			/**
 			 * 获取全局接口数据
 			 */

pages/fullscreen/fullscreen.vue

 <template>
-	<view class="wrapper" :style="{width: `${theStyle.width - theStyle.left}px`, left:`${theStyle.left}px`}">
-		
-		<view :style="{ height: `${theStyle.height}px`, width: `${theStyle.width - theStyle.left}px`, zIndex: 9}">
+	<view class="wrapper" :class="{'tabs-layout': showTabs}" :style="{width: `${theStyle.width - theStyle.left}px`, left:`${theStyle.left}px`}">
+		<!-- 普通选项卡 -->
+		<view v-if="showTabs"
+			style="position: fixed;top: 0;"
+			:style="{
+				width: `${parseInt(tabsElement.width * scale)}px`,
+				height: `${parseInt(tabsElement.height * (scale > 1 ? 1 : scale))}px`,
+				left: `${parseInt(tabsElement.left * scale)}px`,
+				zIndex: 10
+			}"
+		>
+			<NormalTabs
+				:elementInfo="tabsElement"
+			></NormalTabs>	
+		</view>
+		<view :style="{'margin-top': `${tabsElement.height * (scale > 1 ? 1 : scale)}px`, height: `${theStyle.height}px`, width: `${theStyle.width - theStyle.left}px`, zIndex: 9}">
 			<!-- 普通柱状图 -->
 			<NormalBar v-if="element.type == 'NormalBar'" :elementInfo="element"></NormalBar>
 			<!-- 普通折线图 -->
@@ -19,10 +32,15 @@
 	export default {
 		data() {
 			return {
-				element: {}
+				element: {},
+				linkTabsId: '',
+				tabsElement: {}
 			}
 		},
 		computed: {
+			showTabs() {
+				return this.linkTabsId && Object.keys(this.tabsElement).length
+			},
 			theStyle() {
 				const { windowWidth,  windowHeight, screenHeight, safeArea } = uni.getSystemInfoSync()
 				const reduceBottom = screenHeight - safeArea.bottom
@@ -32,12 +50,76 @@
 					left: safeArea.left
 				}
 			},
+			scale() {
+				let info = JSON.parse(uni.getStorageSync('reportInfo'))
+				if(JSON.stringify(info) == "{}") {
+					return
+				}
+				const { windowWidth } = uni.getSystemInfoSync()
+				const { width, height } = info.info
+				return windowWidth / width
+			}
 		}, 
 		onLoad(option) {
 			this.element = JSON.parse(decodeURIComponent(option.element))
+			this.linkTabsId = option.linkTabsId
+			if(this.linkTabsId && uni.getStorageSync('reportInfo')) {
+				let info = JSON.parse(uni.getStorageSync('reportInfo'))
+				const data = info.list.find(item => item.id === this.linkTabsId)
+				this.tabsElement = data
+			}
 			// 去掉全屏的定制按钮
 			const toolbox = {show: false}
 			this.element.option.toolbox = toolbox
+		},
+		onUnload() {
+			// 移除监听事件
+			uni.$off('handleLinkParams')
+			uni.$off('handleLinkComp')
+		},
+		onShow() {
+			/**
+			 * 组件交互 - 组件
+			 */
+			uni.$on('handleLinkComp', ({ showData, hideData }) => {
+				let info = JSON.parse(uni.getStorageSync('reportInfo'))
+				const data = info.list.find(item => showData[0] === item.id)
+				data.hide = false
+				// 去掉全屏的定制按钮
+				data.option.toolbox = { show: false }
+				this.element = data
+			}),
+			/**
+			 * 组件交互 - 参数
+			 */
+			uni.$on('handleLinkParams', ({index, paramName, value}) => {
+				let reportInfo = JSON.parse(uni.getStorageSync('reportInfo'))
+				if(index.length && paramName) {
+					const that = this
+					reportInfo.list = reportInfo.list.map(item => {
+						const flag = index.includes(item.id)
+						if(flag && item.type === 'BasicText' && item.data.dataType === 'static') {
+							that.$set(item.data.dataList, 'text', value)
+						}
+						if(flag && item.data.dataType === 'dynamic') {
+							if(!item.data.queryFormatter) item.data.queryFormatter = {}
+							that.$set(item.data.queryFormatter, paramName, value)
+						}
+						if(flag && item.data.dataType === 'dataSet') {
+							if(!item.data.dataSetInfo.queryFormatter) item.data.dataSetInfo.queryFormatter = {}
+							that.$set(item.data.dataSetInfo.queryFormatter, paramName, value)
+						}
+						if(flag && item.data.dataType === 'public') {
+							if(!item.data.queryFormatter) item.data.queryFormatter = {}
+							that.$set(item.data.queryFormatter, paramName, value)
+						}
+						return item
+					})
+				}
+				this.element = reportInfo.list.find(item => index[0] === item.id)
+				// 去掉全屏的定制按钮
+				this.element.option.toolbox = { show: false }
+			})
 		}
 	}
 </script>
@@ -57,5 +139,11 @@
 	padding-bottom: env(safe-area-inset-bottom); /*兼容 IOS>11.2*/
 }
 
+.tabs-layout {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	flex-direction: column;
+}
 
 </style>

pages/index/index.vue

@@ -265,11 +265,38 @@
 							}
 						})
 					}
-					that.reportInfo = res.data.Result
+					
+					that.reportInfo = this.handleTabsLink(res.data.Result)
 					uni.setStorageSync('reportInfo', JSON.stringify(that.reportInfo))
 					that.getStickyTables()
 				}
 			},
+			/**
+			* tabs 组件处理关联关系
+			*/
+			handleTabsLink(data) {
+				data.list.forEach(item => {
+				  if(item.type === 'NormalTabs' && (item.child.index.length || item.child.data.length)) {
+						if (item.child.index.length) {
+							item.child.index.forEach(child => {
+								const index = data.list.findIndex(i => i.id === child )
+								if(index != -1) {
+									data.list[index].linkTabsId = item.id
+								}
+							})
+						}
+						if (item.child.data.length) {
+							item.child.data.forEach(child => {
+								const index = data.list.findIndex(i => i.id === child.comp )
+								if(index != -1) {
+									data.list[index].linkTabsId = item.id
+								}
+							})
+						}
+				  }
+				})
+				return data
+			},
 			/**
 			 * 获取全局接口数据
 			 */