| 
					
				 | 
			
			
				@@ -1,657 +1,641 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 <template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  <div class="scene-box" > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  <div class="scene-box"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     <DeviceVue ref="DeviceRef" :pageData="pageData" /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  <VentModal style="width: 100%; height: 100%; position: absolute"/> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-   
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  <VentModal style="width: 100%; height: 100%; position: absolute" /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 </template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 <script setup lang="ts"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-import { ref, onUnmounted, onMounted, nextTick, watch } from 'vue'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-import DeviceVue from './components/device/index.vue'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-import Network from './components/network/index.vue' 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-import { getActions } from '/@/qiankun/state'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-import { useRoute } from 'vue-router'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-import { onBeforeUnmount } from 'vue'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-import VentModal from '/@/components/vent/micro/ventModal.vue' 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-const route = useRoute() 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-const actions = getActions(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-const DeviceRef = ref(null) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-const NetworkRef = ref(null) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-const routerParam = ref('home') 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-const pageData = ref({}) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-const pageResult = ref({}) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-const { type, deviceType } = route.query 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-// actions.setGlobalState({ url: { path: '/micro-vent-3dModal/dashboard/analysis', query: { type, deviceType } } }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-const changePageType = (pageType) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  console.log('页面类型', pageType) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  routerParam.value = pageType 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  actions.setGlobalState({ pageObj: { pageType: pageType } }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-watch(() => route.fullPath, (fullPath) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  // const { type, deviceType } = routeVal.query 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  // if (type === 'tunMonitor') { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //   pageData.value = { pageType: deviceType } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //   actions.setGlobalState({ pageObj: { pageType: deviceType } }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  // } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  console.log('fullPath------------------->', fullPath) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-}) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-onMounted(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  // nextTick(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-     
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //   if (type === 'network') { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //     routerParam.value = 'network' 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //     actions.setGlobalState({ pageObj: { pageType: 'network' } }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //   } else if (type === 'home') { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //     actions.setGlobalState({ pageObj: { pageType: 'home' } }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //   else if (type === 'tunMonitor') { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //     if (deviceType) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //       pageData.value = { pageType: deviceType } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //       actions.setGlobalState({ pageObj: { pageType: deviceType } }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //   actions.onGlobalStateChange((newState) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //     for (const key in newState) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //       if (key === 'pageObj') { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //         const pageObj = newState[key] 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //         if (pageObj && pageObj.pageType) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //           routerParam.value = pageObj.pageType 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //           pageData.value = pageObj 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //           console.log('页面参数类型----------->', pageData.value, routerParam.value, pageObj) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //           if (pageObj.timesolution) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //             pageResult.value = pageObj.timesolution 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //           } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //         } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //       } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  //   }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  // }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-}) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  import { ref, onUnmounted, onMounted, nextTick, watch } from 'vue'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  import DeviceVue from './components/device/index.vue'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  import Network from './components/network/index.vue'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  import { getActions } from '/@/qiankun/state'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  import { useRoute } from 'vue-router'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  import { onBeforeUnmount } from 'vue'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  import VentModal from '/@/components/vent/micro/ventModal.vue'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const route = useRoute(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const actions = getActions(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const DeviceRef = ref(null); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const NetworkRef = ref(null); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const routerParam = ref('home'); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const pageData = ref({}); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const pageResult = ref({}); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const { type, deviceType } = route.query; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  // actions.setGlobalState({ url: { path: '/micro-vent-3dModal/dashboard/analysis', query: { type, deviceType } } }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const changePageType = (pageType) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    console.log('页面类型', pageType); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    routerParam.value = pageType; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    actions.setGlobalState({ pageObj: { pageType: pageType } }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  }; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  watch( 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    () => route.fullPath, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    (fullPath) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      // const { type, deviceType } = routeVal.query 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      // if (type === 'tunMonitor') { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      //   pageData.value = { pageType: deviceType } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      //   actions.setGlobalState({ pageObj: { pageType: deviceType } }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      // } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      console.log('fullPath------------------->', fullPath); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  ); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  onMounted(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    // nextTick(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //   if (type === 'network') { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //     routerParam.value = 'network' 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //     actions.setGlobalState({ pageObj: { pageType: 'network' } }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //   } else if (type === 'home') { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //     actions.setGlobalState({ pageObj: { pageType: 'home' } }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //   else if (type === 'tunMonitor') { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //     if (deviceType) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //       pageData.value = { pageType: deviceType } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //       actions.setGlobalState({ pageObj: { pageType: deviceType } }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //   actions.onGlobalStateChange((newState) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //     for (const key in newState) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //       if (key === 'pageObj') { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //         const pageObj = newState[key] 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //         if (pageObj && pageObj.pageType) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //           routerParam.value = pageObj.pageType 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //           pageData.value = pageObj 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //           console.log('页面参数类型----------->', pageData.value, routerParam.value, pageObj) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //           if (pageObj.timesolution) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //             pageResult.value = pageObj.timesolution 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //           } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //         } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //       } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    //   }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    // }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 </script> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-<style lang="less" scoped > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-@import '/@/design/vent/modal.less'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-@ventSpace: zxm; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-.device-header { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  position: fixed; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  width: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  height: 56px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  background: url('/@/assets/images/vent/home/modal-top.png'); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  text-align: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  line-height: 56px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  font-size: 28px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  color: #ffffffdd; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  font-weight: 600; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  z-index: -1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-.select-node { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  position: fixed; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  top: 60px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  left: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  justify-content: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  font-size: 22px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  .title { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    margin-left: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+<style lang="less" scoped> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  @import '/@/design/vent/modal.less'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  @ventSpace: zxm; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-.expansion-icon { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  background: url('/@/assets/images/vent/home/tree-icon-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  left: 190px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  top: 25px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  &:hover { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    background: url('/@/assets/images/vent/home/tree-icon-hover-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-.device-select { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  width: 250px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  height: 500px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  background: url('/@/assets/images/vent/home/tree-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  position: fixed; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  top: 60px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  left: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  pointer-events: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  padding: 20px 10px 30px 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-.is-expansion-icon { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  padding: 5px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  pointer-events: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  z-index: 999; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-.device-select-show { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  left: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  animation-name: treeShow; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  /* 持续时间 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  animation-duration: 1s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) .5s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-.device-select-hide { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  left: -250px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  animation-name: treeHide; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  /* 持续时间 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  animation-duration: 1s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) .5s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-.node-select-show { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  width: 276px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  height: 44px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  background: url('/@/assets/images/vent/home/tree-expansion-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  left: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  animation-name: treeShow; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  /* 持续时间 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  animation-duration: 1s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) .5s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  align-items: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  margin-left: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  justify-content: flex-start; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  pointer-events: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  &:hover { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    background: url('/@/assets/images/vent/home/tree-expansion-hover-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .device-header { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    position: fixed; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    width: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    height: 56px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    background: url('/@/assets/images/vent/home/modal-top.png'); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    text-align: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    line-height: 56px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    font-size: 28px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    color: #ffffffdd; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    font-weight: 600; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    z-index: -1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  .put-away-icon { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    position: relative; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    display: inline-block; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    left: 4px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-.node-select-hide { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  left: -400px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  animation-name: treeHide; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  /* 持续时间 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  animation-duration: 1s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) .5s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-.device-select-box { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  width: 208px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  height: 450px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  overflow-y: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  :deep(.zxm-tree) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    background: transparent !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    color: #fff !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    .zxm-tree-switcher { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      background: transparent !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .select-node { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    position: fixed; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    top: 60px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    left: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    justify-content: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    font-size: 22px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    .zxm-tree-node-content-wrapper.zxm-tree-node-selected { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      background-color: #00b1c8; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .title { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      margin-left: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    .zxm-tree-node-content-wrapper:hover { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      background-color: #00b1c855; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .expansion-icon { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    background: url('/@/assets/images/vent/home/tree-icon-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    left: 190px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    top: 25px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    input { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      height: 0px !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    &:hover { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      background: url('/@/assets/images/vent/home/tree-icon-hover-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  &::-webkit-scrollbar-track { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    border-radius: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    background: #ededed22; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    height: 100px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .device-select { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    width: 250px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    height: 500px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    background: url('/@/assets/images/vent/home/tree-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    position: fixed; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    top: 60px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    left: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    pointer-events: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    padding: 20px 10px 30px 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  &::-webkit-scrollbar-thumb { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    background: #4288A444; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-.location-icon { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  width: 46px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  height: 178px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  top: 60px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  // right: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  background: url('/@/assets/images/vent/home/location-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  writing-mode: vertical-lr; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  line-height: 46px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  padding-top: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  pointer-events: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  cursor: pointer; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  &:hover { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    background: url('/@/assets/images/vent/home/location-hover-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .is-expansion-icon { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    padding: 5px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    pointer-events: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    z-index: 999; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  .location-text { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    padding-top: 20px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    letter-spacing: 3px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    font-size: 16px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .device-select-show { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    left: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    animation-name: treeShow; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    /* 持续时间 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    animation-duration: 1s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-.location-select { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  position: fixed; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  top: 60px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  // right: 240px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  pointer-events: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  .location-select-box { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    width: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    height: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    position: relative; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    &::before { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      content: ""; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      width: 230px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      height: 500px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      top: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      left: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      background: url('/@/assets/images/vent/home/tree-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      transform: rotateY(180deg); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      z-index: -1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      // &:hover { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      //   background: url('/@/assets/images/vent/home/tree-icon-hover-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      //   background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      // } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .device-select-hide { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    left: -250px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    animation-name: treeHide; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    /* 持续时间 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    animation-duration: 1s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    .location-top-title { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      width: 225px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      height: 68px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      background: url('/@/assets/images/vent/home/turn-location-top-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      top: 5px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      left: 5px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      flex-direction: row; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      justify-content: space-between; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      align-items: flex-end; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .node-select-show { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    width: 276px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    height: 44px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    background: url('/@/assets/images/vent/home/tree-expansion-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    left: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    animation-name: treeShow; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    /* 持续时间 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    animation-duration: 1s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    align-items: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    margin-left: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    justify-content: flex-start; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    pointer-events: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      .title { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        font-size: 18px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        position: relative; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        top: -14px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        right: 15px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    &:hover { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      background: url('/@/assets/images/vent/home/tree-expansion-hover-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    .location-expansion-icon { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      background: url('/@/assets/images/vent/home/tree-icon-cover-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .put-away-icon { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       position: relative; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      left: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      top: -15px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      padding: 5px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      &:hover { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        background: url('/@/assets/images/vent/home/tree-icon-cover-hover-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      display: inline-block; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      left: 4px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  .location-container { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    width: 200px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    height: 390px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    flex-direction: column; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    top: 80px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    left: 18px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .node-select-hide { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    left: -400px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    animation-name: treeHide; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    /* 持续时间 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    animation-duration: 1s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .device-select-box { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    width: 208px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    height: 450px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     overflow-y: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    .location-item { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      line-height: 30px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      justify-content: space-between; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      background-image: linear-gradient(to left, #39f5ff05, #39f5ff10); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      margin: 3px 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      .item-title { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        width: 80px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        text-align: right; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        color: #87f1ff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    :deep(.zxm-tree) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      background: transparent !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      color: #fff !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      .zxm-tree-switcher { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        background: transparent !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    .location-bottom-btn { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      width: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      justify-content: flex-end; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      margin-top: 20px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      .zxm-tree-node-content-wrapper.zxm-tree-node-selected { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        background-color: #00b1c8; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      span { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        display: inline-block; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        width: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        background: #00709955; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        border-radius: 3px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        border: 1px solid rgba(174, 243, 255, 0.3); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        text-align: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        padding: 2px 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        cursor: pointer; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      .zxm-tree-node-content-wrapper:hover { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        background-color: #00b1c855; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        &:hover { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          background: #00557422; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      input { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        height: 0px !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    &::-webkit-scrollbar-track { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      border-radius: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      background: #ededed22; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      height: 100px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    &::-webkit-scrollbar-thumb { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      background: #4288a444; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-.location-select-show { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  right: 240px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  animation-name: locationShow; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  /* 持续时间 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  animation-duration: 1s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) .5s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-.location-select-hide { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  right: -2px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  animation-name: locationHide; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  /* 持续时间 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  animation-duration: 1s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) .5s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-.location-btn-show { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  right: -0px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  animation-name: locationBtnShow; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  /* 持续时间 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  animation-duration: 1s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) .5s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-.location-btn-hide { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  right: -240px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  animation-name: locationBtnHide; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  /* 持续时间 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  animation-duration: 1s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) .5s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-.bottom-tabs-box { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  position: relative; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  .to-small { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    width: 60px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    height: 60px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    background: url('/@/assets/images/vent/home/tosmall.png') no-repeat center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    background-size: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .location-icon { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    width: 46px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    height: 178px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    top: -65px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    right: 36px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    border-radius: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    padding: 8px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    backdrop-filter: blur(10px); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    background-color: rgba(45, 86, 137, 0.418); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    top: 60px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    // right: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    background: url('/@/assets/images/vent/home/location-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    writing-mode: vertical-lr; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    line-height: 46px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    padding-top: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    pointer-events: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    cursor: pointer; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     &:hover { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      background-color: rgba(79, 104, 134, 0.418); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      background: url('/@/assets/images/vent/home/location-hover-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .location-text { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      padding-top: 20px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      letter-spacing: 3px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      font-size: 16px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  .device-button-group { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    top: -30px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    width: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .location-select { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    position: fixed; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    top: 60px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    // right: 240px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    pointer-events: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    .device-button { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      height: 26px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      padding: 0 20px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      background: linear-gradient(45deg, #04e6fb55, #0c5cab55); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      clip-path: polygon(10px 0, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          0 50%, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          10px 100%, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          100% 100%, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          calc(100% - 10px) 50%, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          100% 0); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      justify-content: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      align-items: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      color: #FFF; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .location-select-box { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      width: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      height: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       position: relative; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      cursor: pointer; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      &:nth-child(1) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        left: calc(-6px * 1); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      &::before { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        content: ''; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        width: 230px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        height: 500px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        top: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        left: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        background: url('/@/assets/images/vent/home/tree-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        transform: rotateY(180deg); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        z-index: -1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        // &:hover { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        //   background: url('/@/assets/images/vent/home/tree-icon-hover-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        //   background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        // } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      &:nth-child(2) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        left: calc(-6px * 2); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      .location-top-title { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        width: 225px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        height: 68px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        background: url('/@/assets/images/vent/home/turn-location-top-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        top: 5px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        left: 5px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        flex-direction: row; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        justify-content: space-between; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        align-items: flex-end; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        .title { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          font-size: 18px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          position: relative; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          top: -14px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          right: 15px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      &:nth-child(3) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        left: calc(-6px * 3); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      .location-expansion-icon { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        background: url('/@/assets/images/vent/home/tree-icon-cover-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        position: relative; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        left: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        top: -15px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        padding: 5px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      &:nth-child(4) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        left: calc(-6px * 4); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &:hover { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          background: url('/@/assets/images/vent/home/tree-icon-cover-hover-bg.png') no-repeat; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          background-size: contain; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      &:nth-child(5) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        left: calc(-6px * 5); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .location-container { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      width: 200px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      height: 390px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      flex-direction: column; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      top: 80px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      left: 18px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      overflow-y: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      .location-item { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        line-height: 30px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        justify-content: space-between; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        background-image: linear-gradient(to left, #39f5ff05, #39f5ff10); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        margin: 3px 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        .item-title { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          width: 80px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          text-align: right; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          color: #87f1ff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      &:nth-child(6) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        left: calc(-6px * 6); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      .location-bottom-btn { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        width: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        justify-content: flex-end; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        margin-top: 20px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        span { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          display: inline-block; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          width: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          background: #00709955; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          border-radius: 3px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          border: 1px solid rgba(174, 243, 255, 0.3); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          text-align: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          padding: 2px 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          cursor: pointer; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          &:hover { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            background: #00557422; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      &:nth-child(7) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        left: calc(-6px * 7); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .location-select-show { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    right: 240px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    animation-name: locationShow; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    /* 持续时间 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    animation-duration: 1s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      &:nth-child(8) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        left: calc(-6px * 8); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .location-select-hide { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    right: -2px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    animation-name: locationHide; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    /* 持续时间 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    animation-duration: 1s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      &:nth-child(9) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        left: calc(-6px * 9); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .location-btn-show { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    right: -0px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    animation-name: locationBtnShow; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    /* 持续时间 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    animation-duration: 1s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      &:nth-child(10) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        left: calc(-6px * 10); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .location-btn-hide { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    right: -240px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    animation-name: locationBtnHide; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    /* 持续时间 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    animation-duration: 1s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      &:nth-child(11) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        left: calc(-6px * 11); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .bottom-tabs-box { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    position: relative; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      &:nth-child(12) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        left: calc(-6px * 12); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .to-small { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      width: 60px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      height: 60px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      background: url('/@/assets/images/vent/home/tosmall.png') no-repeat center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      background-size: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      top: -65px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      right: 36px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      border-radius: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      padding: 8px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      backdrop-filter: blur(10px); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      background-color: rgba(45, 86, 137, 0.418); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      &:nth-child(13) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        left: calc(-6px * 13); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      &:hover { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        background-color: rgba(79, 104, 134, 0.418); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      &:nth-child(14) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        left: calc(-6px * 14); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .device-button-group { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      top: -30px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      width: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      &:nth-child(15) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        left: calc(-6px * 15); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      .device-button { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        height: 26px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        padding: 0 20px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        background: linear-gradient(45deg, #04e6fb55, #0c5cab55); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        clip-path: polygon(10px 0, 0 50%, 10px 100%, 100% 100%, calc(100% - 10px) 50%, 100% 0); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        justify-content: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        align-items: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        position: relative; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        cursor: pointer; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &:nth-child(1) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          left: calc(-6px * 1); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &:nth-child(2) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          left: calc(-6px * 2); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &:nth-child(3) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          left: calc(-6px * 3); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &:nth-child(4) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          left: calc(-6px * 4); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &:nth-child(5) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          left: calc(-6px * 5); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &:nth-child(6) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          left: calc(-6px * 6); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &:nth-child(7) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          left: calc(-6px * 7); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &:nth-child(8) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          left: calc(-6px * 8); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &:nth-child(9) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          left: calc(-6px * 9); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &:nth-child(10) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          left: calc(-6px * 10); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &:nth-child(11) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          left: calc(-6px * 11); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &:nth-child(12) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          left: calc(-6px * 12); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &:nth-child(13) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          left: calc(-6px * 13); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &:nth-child(14) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          left: calc(-6px * 14); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      &:first-child { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        clip-path: polygon(0 0, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            10px 50%, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            0 100%, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            100% 100%, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            calc(100% - 10px) 50%, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            100% 0); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &:nth-child(15) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          left: calc(-6px * 15); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &:first-child { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          clip-path: polygon(0 0, 10px 50%, 0 100%, 100% 100%, calc(100% - 10px) 50%, 100% 0); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      .device-active { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        background: linear-gradient(45deg, #04e6fb, #0c5cab); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        &::before { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          border-color: #0efcff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          box-shadow: 1px 1px 3px 1px #0efcff inset; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    .device-active { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      background: linear-gradient(45deg, #04e6fb, #0c5cab); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .enter-detail { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      cursor: pointer; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      right: 120px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      top: -6px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      padding: 5px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      border-radius: 5px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      margin-left: 8px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      margin-right: 8px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      width: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      height: 33px !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      align-items: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      justify-content: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      padding: 5px 15px 5px 15px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      cursor: pointer; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      &:hover { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        background: linear-gradient(#2cd1ff55, #1eb0ff55); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       &::before { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        border-color: #0efcff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        box-shadow: 1px 1px 3px 1px #0efcff inset; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        width: calc(100% - 6px); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        height: 27px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        content: ''; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        top: 3px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        right: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        left: 3px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        bottom: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        z-index: -1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        border-radius: inherit; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        /*important*/ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        background: linear-gradient(#1fa6cb, #127cb5); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  .enter-detail { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    cursor: pointer; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    right: 120px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    top: -6px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    padding: 5px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    border-radius: 5px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    margin-left: 8px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    margin-right: 8px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    width: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    height: 33px !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    align-items: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    justify-content: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    padding: 5px 15px 5px 15px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    cursor: pointer; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    &:hover { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      background: linear-gradient(#2cd1ff55, #1eb0ff55); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  @keyframes treeShow { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    0% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      left: -400px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      opacity: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    &::before { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      width: calc(100% - 6px); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      height: 27px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      content: ''; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      top: 3px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      right: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      left: 3px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      bottom: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      z-index: -1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      border-radius: inherit; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      /*important*/ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      background: linear-gradient(#1fa6cb, #127cb5); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    100% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      left: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      opacity: 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-@keyframes treeShow { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  0% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    left: -400px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    opacity: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  @keyframes treeHide { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    0% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      left: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      opacity: 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  100% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    left: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    opacity: 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    100% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      left: -400px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      opacity: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-@keyframes treeHide { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  0% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    left: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    opacity: 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  @keyframes locationShow { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    0% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      right: 0px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      opacity: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  100% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    left: -400px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    opacity: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    100% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      right: 240px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      opacity: 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-@keyframes locationShow { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  0% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    right: 0px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    opacity: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  @keyframes locationHide { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    0% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      right: 240px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      opacity: 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  100% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    right: 240px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    opacity: 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    100% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      right: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      opacity: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-@keyframes locationHide { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  0% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    right: 240px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    opacity: 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  @keyframes locationBtnShow { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    0% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      right: -240px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      opacity: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  100% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    right: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    opacity: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    100% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      right: -2px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      opacity: 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-@keyframes locationBtnShow { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  0% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    right: -240px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    opacity: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  @keyframes locationBtnHide { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    0% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      right: -2px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      opacity: 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  100% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    right: -2px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    opacity: 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    100% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      right: -240px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      opacity: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-@keyframes locationBtnHide { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  0% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    right: -2px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    opacity: 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  :deep(.@{ventSpace}-tabs-tabpane-active) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    // overflow: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    height: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  100% { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    right: -240px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    opacity: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  :deep(.zxm-select-dropdown) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    left: 0 !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    color: #000000 !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-:deep(.@{ventSpace}-tabs-tabpane-active) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  // overflow: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  height: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-:deep(.zxm-select-dropdown) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  left: 0 !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  color: #000000 !important; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-}</style> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+</style> 
			 |