64 lines
1.4 KiB
Vue
64 lines
1.4 KiB
Vue
<template>
|
|
<div class="content blue" ref="content">
|
|
<jxHeader
|
|
:title="title"
|
|
@switchColor="switchColor"
|
|
/>
|
|
<div class="body-container">
|
|
<div class="main-container">
|
|
<keep-alive :include="keepAlive" >
|
|
<router-view/>
|
|
</keep-alive>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapGetters } from 'vuex'
|
|
import jxHeader from '@components/header.vue'
|
|
export default {
|
|
components: {
|
|
jxHeader
|
|
},
|
|
data () {
|
|
return {}
|
|
},
|
|
computed: {
|
|
title () {
|
|
let res = ['清洗上料', '清洗下料', '人工倒料', '选择物料'][Number(this.$route.meta.guidePath) - 1]
|
|
return res
|
|
},
|
|
...mapGetters(['keepAlive'])
|
|
},
|
|
methods: {
|
|
switchColor (type) {
|
|
switch (type) {
|
|
case 1:
|
|
this.$refs.content.classList.value = 'content overall_orange'
|
|
break
|
|
case 2:
|
|
this.$refs.content.classList.value = 'content overall_lightgreen'
|
|
break
|
|
case 3:
|
|
this.$refs.content.classList.value = 'content overall_blue'
|
|
break
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="stylus" scoped>
|
|
@import '~@style/mixin.styl'
|
|
.content
|
|
_wh(100%, 100vh)
|
|
.body-container
|
|
_wh(calc(100% - 30px), calc(100% - 55px))
|
|
margin 0 auto 10px
|
|
padding 5px
|
|
border 1px solid #484cce
|
|
.main-container
|
|
_wh(100%, 100%)
|
|
</style>
|