<template>
|
<view class="index ">
|
|
<view style="margin-top: 80px;position: fixed; z-index: 9999999999999999999999;">
|
<view v-for="(item,index) in warnlist" :key="index" style="margin-top: 10px;">
|
<u-alert :show="show" type="warning" :closable="true" :description="item"></u-alert>
|
</view>
|
</view>
|
<homeCom v-if="currentIndex == 0 && !isceju" :tabheight='tabBarHeight' :webHeight='webHeight' :topheight='topheight'
|
:bottomheight='bottomheight'></homeCom>
|
<cejuCom v-if="currentIndex == 0 && isceju" :webHeight='webHeight' :topheight='topheight'
|
></cejuCom>
|
<mainCom v-show="currentIndex == 1" ref="mainRef"></mainCom>
|
<equipmentCom v-show="currentIndex == 2"></equipmentCom>
|
<fenceCom v-show="currentIndex == 3"></fenceCom>
|
<personCom v-show="currentIndex == 4"></personCom>
|
<view class="tn-skeleton tn-skeleton-fillet">
|
<tn-tabbar @change="chenge" :shadow="false" v-model="currentIndex" :safeAreaInsetBottom="true"
|
:list="tabbarList" activeColor="#838383" inactiveColor="#AAAAAA" activeIconColor="tn-cool-bg-color-7"
|
:animation="true" v-if="showTabbar"></tn-tabbar>
|
</view>
|
|
<tn-skeleton :show="showSkeleton"></tn-skeleton>
|
<u-modal confirmText="去登录" title="您还未登录" content="请登录后查看更多内容!" cancelText="再看看" :show="showfaka"
|
@cancel="cancelfaka" @confirm="confirmfaka" ref="uModal" :showCancelButton="true"
|
:closeOnClickOverlay="false">
|
|
</u-modal>
|
<successCom ref="refSuccess"></successCom>
|
</view>
|
</template>
|
|
<script>
|
import successCom from '@/components/success.vue'
|
import {
|
findWarningNum,
|
earlyWarning,
|
} from '@/config/api.js';
|
import store from '@/store/index.js'
|
import {
|
formatDate,
|
get_time_cha_s
|
} from '@/js/tools.js'
|
import {
|
DateFormat
|
} from '@/js/DateFormat.js'
|
|
import webviewCom from './webview.vue';
|
import webbCom from './webb.vue';
|
import homeCom from './home.vue';
|
import cejuCom from './ceju.vue';
|
// import dituCom from './ditu.vue';
|
import mainCom from './main.vue';
|
import personCom from './person.vue';
|
import alarmCom from './alarm.vue';
|
import equipmentCom from './equipment.vue';
|
import fenceCom from './fence.vue';
|
|
export default {
|
components: {
|
// dituCom,
|
webviewCom,
|
webbCom,
|
successCom,
|
homeCom,
|
cejuCom,
|
mainCom,
|
personCom,
|
alarmCom,
|
equipmentCom,
|
fenceCom,
|
},
|
data() {
|
return {
|
showfaka: false,
|
show: true,
|
title: '登高望远',
|
description: '欲穷千里目，更上一层楼',
|
warningNum: 0,
|
// link: 'http://www.baidu.com',
|
showSkeleton: true,
|
currentIndex: -1,
|
showTabbar: true,
|
scrollHeight: 800,
|
topheight: 0,
|
bottomheight: 0,
|
webHeight: 0,
|
tabBarHeight: 0,
|
title: 'Hello',
|
list: [{
|
text: '分享'
|
}],
|
warnlist: [],
|
tabbarList: [{
|
title: '首页',
|
activeIcon: '/static/tabbar/report_f_icon.png',
|
inactiveIcon: '/static/tabbar/report_l_icon.png',
|
iconSize: 42,
|
activeColor: '#40A290',
|
},
|
|
{
|
title: '信息',
|
activeIcon: '/static/tabbar/info_l_icon.png',
|
inactiveIcon: '/static/tabbar/info_f_icon.png',
|
iconSize: 42,
|
activeColor: '#40A290',
|
// count: 0,
|
// activeIconColor: '#FFFFFF',
|
// inactiveIconColor: '#FFFFFF',
|
// iconSize: 50,
|
// out: true
|
},
|
{
|
title: '设备',
|
activeIcon: '/static/tabbar/equipment_f_icon.png',
|
inactiveIcon: '/static/tabbar/equipment_l_icon.png',
|
iconSize: 42,
|
activeColor: '#40A290',
|
// activeIconColor: '#FFFFFF',
|
// inactiveIconColor: '#FFFFFF',
|
// iconSize: 50,
|
// out: true
|
},
|
{
|
title: '围栏',
|
activeIcon: '/static/tabbar/fence_f_icon.png',
|
inactiveIcon: '/static/tabbar/fence_l_icon.png',
|
iconSize: 42,
|
activeColor: '#40A290',
|
// activeIconColor: '#FFFFFF',
|
// inactiveIconColor: '#FFFFFF',
|
// iconSize: 50,
|
// // out: true
|
},
|
|
{
|
title: '我的',
|
activeIcon: '/static/tabbar/my_f_icon.png',
|
inactiveIcon: '/static/tabbar/my_l_icon.png',
|
iconSize: 42,
|
activeColor: '#40A290',
|
}
|
],
|
|
}
|
},
|
onLoad() {
|
const systemInfo = uni.getSystemInfoSync()
|
this.tabBarHeight = systemInfo.windowBottom
|
this.earlyWarning();
|
this.findWarningNum();
|
},
|
computed: {
|
pageTitle() {
|
return this.tabbarList[this.currentIndex].title
|
},
|
heHeight() {
|
let num = 0;
|
return num;
|
}
|
},
|
onReachBottom() {
|
|
},
|
watch: {
|
|
},
|
mounted() {
|
this.getTabBarHeight();
|
this.$nextTick(() => {
|
// 获取系统信息
|
const systemInfo = uni.getSystemInfoSync()
|
this.skeletonHeight = systemInfo.safeArea.height
|
this.webHeight = this.skeletonHeight - this.tabBarHeight
|
|
// this.vuex_status_bar_height = this.webHeight
|
this.currentIndex = 0
|
})
|
this.webHeight = this.skeletonHeight - this.vuex_custom_bar_height - this.tabBarHeight + this
|
.vuex_status_bar_height
|
// store.commit('$tStore', {
|
// name: 'webHeight',
|
// value: this.webHeight
|
// })
|
this.topheight = this.vuex_custom_bar_height + 15
|
store.commit('$tStore', {
|
name: 'bleHeight',
|
value: this.topheight
|
})
|
// this.bottomheight = this.tabBarHeight + 15
|
this.currentIndex = 0
|
let indexHeight = 0
|
// #ifdef MP-WEIXIN
|
this.marginTop = this.vuex_custom_bar_height
|
indexHeight = 40
|
// #endif
|
|
// #ifdef APP-PLUS || APP
|
this.marginTop = this.vuex_custom_bar_height
|
indexHeight = 20
|
// #endif
|
|
// #ifdef H5
|
this.marginTop = this.vuex_custom_bar_height + this.vuex_status_bar_height
|
indexHeight = 50
|
// #endif
|
|
store.commit('$tStore', {
|
name: 'vuex_custom_scroll_height',
|
value: this.scrollHeight - this.tabBarHeight
|
})
|
|
store.commit('$tStore', {
|
name: 'vuex_padding_top',
|
value: this.marginTop
|
})
|
store.commit('$tStore', {
|
name: 'vuex_custom_index_height',
|
value: this.indexHeight
|
})
|
setTimeout(() => {
|
this.showSkeleton = false
|
}, 1000)
|
|
},
|
// onReady() {
|
// this.getTabBarHeight();
|
// },
|
methods: {
|
cancelfaka() {
|
this.showfaka = false
|
uni.reLaunch({
|
url: '/pages/index/index'
|
});
|
},
|
confirmfaka() {
|
this.showfaka = false
|
uni.reLaunch({
|
url: '/pages/index/login'
|
});
|
},
|
tabChange(index) {
|
uni.redirectTo({
|
url: this.list[index]['pagePath']
|
})
|
},
|
getTabBarHeight() {
|
uni.createSelectorQuery().in(this).select('.tn-tabbar').boundingClientRect(data => {
|
if (data) {
|
this.tabBarHeight = data.height;
|
this.bottomheight = this.tabBarHeight + 15
|
var allheight = this.skeletonHeight - this.tabBarHeight - 16
|
store.commit('$tStore', {
|
name: 'vuex_custom_index_height',
|
value: allheight
|
})
|
}
|
}).exec();
|
|
},
|
closeHandler(e) {
|
this.warnlist.splice(e, 1)
|
},
|
timeToSeconds(time) {
|
//把时间转成秒数，相减，在转成分钟，得出时间
|
const [hours, minutes, seconds] = time.split(':').map(Number);
|
return (hours * 3600) + (minutes * 60) + seconds;
|
},
|
earlyWarning() {
|
if (this.vuex_is_login) {
|
earlyWarning().then((res) => {
|
var list = []
|
// this.warnlist=res.data
|
if (res.data != null) {
|
res.data.forEach((e, i) => {
|
console.log("测试预警============》》》》》》》》》》》》》");
|
const time2InSeconds = this.timeToSeconds(e.begtime);
|
const time1InSeconds = this.timeToSeconds(formatDate(new Date(),
|
'hh:mm:ss'));
|
// 计算两个时间的秒数差
|
const secondsDifference = Math.abs(time2InSeconds - time1InSeconds);
|
// 将秒数差转换为分钟数
|
const minutesDifference = Math.floor(secondsDifference / 60);
|
|
// this.warnlist.push( e.fencename + '还有' + minutesDifference +
|
// '分钟开始工作，预警内容：' + e.yjcontent + ',请尽快提前准备进入工作区域')
|
this.warnlist.push("系统预警:" + e.fencename + '开始工作,请尽快提前准备进入工作区域')
|
const message = e.fencename + '还有' + minutesDifference + '分钟开始工作，预警内容：' + e
|
.yjcontent + '，请尽快提前准备进入工作区域';
|
})
|
}
|
})
|
}
|
setTimeout(() => {
|
//5秒播放一次
|
this.earlyWarning();
|
}, 5000);
|
},
|
|
findWarningNum() {
|
const params = {
|
company: this.company,
|
}
|
if (this.vuex_is_login) {
|
findWarningNum(params).then((res) => {
|
if (res.code == 0) {
|
this.tabbarList[1].count = res.data
|
} else {
|
this.$refs.refSuccess.showBox({
|
type: 'error',
|
txt: res.msg
|
});
|
}
|
})
|
}
|
setTimeout(() => {
|
//5秒播放一次
|
this.findWarningNum();
|
}, 2000);
|
},
|
|
chenge(index) {
|
console.log(1111166666);
|
if (this.vuex_is_login) {
|
|
console.log(index);
|
// this.currentIndex = index;
|
if (index == 1) {
|
|
}
|
} else {
|
this.showfaka = true
|
}
|
|
},
|
click(index) {
|
|
}
|
}
|
}
|
</script>
|
|
<style>
|
.index {
|
overflow: hidden;
|
height: 100%;
|
}
|
|
.content {
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
justify-content: center;
|
}
|
|
.home-search {
|
background-color: #fff !important;
|
z-index: 2;
|
}
|
|
.logo {
|
height: 200rpx;
|
width: 200rpx;
|
margin-top: 200rpx;
|
margin-left: auto;
|
margin-right: auto;
|
margin-bottom: 50rpx;
|
}
|
|
.text-area {
|
display: flex;
|
justify-content: center;
|
}
|
|
.title {
|
font-size: 36rpx;
|
color: #8f8f94;
|
}
|
|
.custom-tabbar-page {
|
height: calc(100vh - (100rpx + env(safe-area-inset-bottom) / 2));
|
background-color: #f8f8f8;
|
}
|
</style>
|
