135 lines
		
	
	
		
			3.1 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			135 lines
		
	
	
		
			3.1 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
| <!--
 | |
|     filename: container.vue
 | |
|     author: liubin
 | |
|     date: 2024-04-16 14:51:25
 | |
|     description:
 | |
| -->
 | |
| 
 | |
| <template>
 | |
|   <!-- <div class="copilot-layout" ref="copilot-layout"> -->
 | |
|   <div class="copilot-layout produce" ref="copilot-layout">
 | |
|     <CopilotHeaderVue :than="than" :active="page" :period="period" @update:active="updateActive" @update:period="period = $event"
 | |
|       @update:than="updateThan" />
 | |
| 
 | |
|     <YieldCopilot :period="period"  :than="than"  />
 | |
|     <!-- <EnergyCopilot v-if="page == '综合'" :period="period" /> -->
 | |
|     <!-- <EfficiencyCopilot v-if="page == '效率'" :period="period" /> -->
 | |
|     <div class="copilot-footer">© 中建材智能自动化研究院有限公司</div>
 | |
|   </div>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
| import CopilotHeaderVue from "./components/CopilotHeader.vue";
 | |
| import YieldCopilot from "./yield/index.vue";
 | |
| // import EnergyCopilot from "./energy/index.vue";
 | |
| // import EfficiencyCopilot from "./efficiency/index.vue";
 | |
| 
 | |
| export default {
 | |
|   name: "copilotContainer",
 | |
|   components: {
 | |
|     CopilotHeaderVue,
 | |
|     YieldCopilot,
 | |
|     // EnergyCopilot,
 | |
|     // EfficiencyCopilot,
 | |
|   },
 | |
|   data() {
 | |
|     return {
 | |
|       page: "产量",
 | |
|       period: "月",
 | |
|       than:'同比',
 | |
|       currentsStyles: '',
 | |
|     };
 | |
|   },
 | |
|   methods: {
 | |
|     updateThan(val) {
 | |
|       console.log(val);
 | |
|       this.than = val;
 | |
|       // this.getMes();
 | |
|     },
 | |
|     updateActive(val, oldVal) {
 | |
|       console.log(val)
 | |
|       if (val === '效率') {
 | |
|         this.$router.push({
 | |
|           path: 'efficiency-container',
 | |
|           query: {
 | |
|             name: '效率'
 | |
|           }
 | |
|         })
 | |
|         // this.page = oldVal
 | |
|       } else if (val === '产量') {
 | |
|         this.$router.push({
 | |
|           path: 'main',
 | |
|           query: {
 | |
|             name: '产量'
 | |
|           }
 | |
|         })
 | |
|         // this.page = oldVal
 | |
|       }
 | |
|     }
 | |
|   },
 | |
|   // mounted() {
 | |
|   //   this.page = this.$route.query.name
 | |
|   // },
 | |
|   // watch: {
 | |
|   //   page(val) {
 | |
|   //     if (val === '产量') {
 | |
|   //       console.log(val)
 | |
|   //       this.currentsStyles =
 | |
|   //         'height: calc(100% + 38px)'
 | |
|   //       console.log(this.currentsStyles)
 | |
|   //     } else {
 | |
|   //       console.log(val)
 | |
|   //       this.currentsStyles = 'height:100%+38px'
 | |
|   //       console.log(this.currentsStyles)
 | |
|   //     }
 | |
|   //     immediate: true
 | |
|   //   }
 | |
|   // }
 | |
|   // mounted() {
 | |
|   //   document.body.style.minHeight = "1024px";
 | |
|   //   document.body.style.minWidth = "1550px";
 | |
|   // },
 | |
|   // destroyed() {
 | |
|   //   document.body.style.minHeight = "1024px";
 | |
|   //   document.body.style.minWidth = "1550px";
 | |
|   // },
 | |
| };
 | |
| </script>
 | |
| <style>
 | |
| .copilot-layout {
 | |
|   padding: 16px;
 | |
|   background: url(../../assets/images/copilot-bg.png) 0 0 / 100% 100% no-repeat;
 | |
|   position: absolute;
 | |
|   left: -16px;
 | |
|   /* top: -8px; */
 | |
|   /* height: calc(100% + 38px); */
 | |
|   width: calc(100% + 30px);
 | |
|   z-index: 1001;
 | |
|   color: #fff;
 | |
|   display: flex;
 | |
|   flex-direction: column;
 | |
|   gap: 8px;
 | |
| }
 | |
| 
 | |
| .produce {
 | |
|   height: calc(100% + 38px);
 | |
| }
 | |
| 
 | |
| .other {
 | |
|   height: calc(100% + 240px);
 | |
| }
 | |
| 
 | |
| .copilot-footer {
 | |
|   /** position: absolute;
 | |
|   bottom: 10px; **/
 | |
|   height: 10px;
 | |
|   width: 100%;
 | |
|   color: rgb(80, 80, 80);
 | |
|   user-select: none;
 | |
|   font-size: 14px;
 | |
|   letter-spacing: 1px;
 | |
|   display: grid;
 | |
|   place-content: center;
 | |
| }
 | |
| </style>
 |