88 lines
1.6 KiB
Vue
88 lines
1.6 KiB
Vue
<template>
|
|
<view :style="{height:'100vh',overflow:'hidden'}">
|
|
<u-status-bar></u-status-bar>
|
|
<u-navbar
|
|
title="工情信息"
|
|
:autoBack="true"
|
|
:titleStyle="{
|
|
fontSize:'18px'
|
|
}"
|
|
:height='44'
|
|
:safeAreaInsetTop=true
|
|
leftIconSize='20'
|
|
leftIconColor='rgb(153, 153, 153)'
|
|
>
|
|
</u-navbar>
|
|
<u-tabs
|
|
:list="tabsOptions"
|
|
@click="tabsChange"
|
|
:scrollable=false
|
|
class="tabsClass"
|
|
:activeStyle="{color: 'rgb(37, 157, 255)',fontSize: '16px'}"
|
|
:inactiveStyle="{color: '#606266',fontSize: '16px'}"
|
|
lineColor="transparent"
|
|
itemStyle="height: 44px"
|
|
>
|
|
</u-tabs>
|
|
<uniQk v-if="tabsVal==='uniQk'" ref="childRef1"></uniQk>
|
|
<uniXq v-if="tabsVal==='uniXq'" ref="childRef2"></uniXq>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import moment from 'moment'
|
|
import uniQk from './qk.vue';
|
|
import uniXq from './xq.vue';
|
|
|
|
export default {
|
|
components: { uniQk, uniXq },
|
|
data() {
|
|
return {
|
|
tabsOptions:[
|
|
{
|
|
name:'运行情况',
|
|
components:'uniQk'
|
|
},
|
|
{
|
|
name:'工程险情',
|
|
components:'uniXq'
|
|
}
|
|
],
|
|
tabsVal:'uniQk'
|
|
};
|
|
},
|
|
methods: {
|
|
tabsChange(item) {
|
|
this.tabsVal = item.components
|
|
console.log(this.tabsVal);
|
|
},
|
|
refresh(fun) {
|
|
console.log('执行刷新')
|
|
fun()
|
|
}
|
|
},
|
|
onShow() {
|
|
if(this.tabsVal==='uniQk'){
|
|
this.$refs.childRef1.submit();
|
|
}else{
|
|
this.$refs.childRef2.submit();
|
|
}
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.myTitleStyle{
|
|
font-size: 30px;
|
|
background-color: red;
|
|
height: 200px;
|
|
}
|
|
.tabsClass{
|
|
margin-top: 44px;
|
|
height: 44px;
|
|
padding: 0 40px;
|
|
border-top: 1px solid #eee;
|
|
border-bottom: 1px solid #eee;
|
|
}
|
|
</style>
|