<template>
	<view class="device-detail-page">
		<!-- 公共组件-每个页面必须引入 -->
		<public-module></public-module>
		<u-sticky bgColor="#fff"><u-tabs :list="list" :current="currentTab" @click="handleTabClick"></u-tabs></u-sticky>
		<view style="margin-top:30rpx;">
			<basicInfo v-show="currentTab == 0" :deviceDetail="deviceDetail" />
			<realTimeData v-show="currentTab === 1" />
			<historyData v-show="currentTab == 2" />
			<alarmHistory v-show="currentTab == 3" />
			<commondRecord v-show="currentTab == 4" />
		</view>
		<f-tabbar></f-tabbar>
	</view>
</template>

<script>
import fTabbar from '@/components/module/f-tabbar/f-tabbar';
import Tab from '@/components/yyh-tab/Tab.vue';
import basicInfo from './tabDetail/basicInfo.vue';
import realTimeData from './tabDetail/realtimeData.vue';
import alarmHistory from './tabDetail/alarmHistory.vue';
import historyData from './tabDetail/historyData.vue';
import commondRecord from './tabDetail/commondRecord.vue';

export default {
	components: {
		fTabbar,
		Tab,
		basicInfo,
		realTimeData,
		alarmHistory,
		historyData,
		commondRecord
	},
	data() {
		return {
			list: [{ name: '基础信息' }, { name: '实时数据' }, { name: '历史数据' }, { name: '告警记录' }, { name: '命令记录' }],
			currentTab: 2,
			id: '',
			deviceDetail: {}
		};
	},
	async onLoad(options) {
		const { id, alarmStatus, lastOnlineTime } = options;
		const res = await uni.$u.http.get(`/yt/device/${id}`);
		this.deviceDetail = { ...res, alarmStatus, lastOnlineTime };

		var socketTask = uni.connectSocket({
			url: 'wss://dev.thingskit.com:8080/api/ws/plugins/telemetry?token=' + uni.getStorageSync('userInfo').isToken, //仅为示例，并非真实接口地址。
			complete: ()=> {}
		});
		uni.onSocketOpen((header)=>{
			console.log('连接成功',header)
		})
		// socketTask.onMessage(function(data) {
		// 	console.log('收到消息了', data);
		// });
		socketTask.send({ 
			data: JSON.stringify({
				attrSubCmds: [],
				tsSubCmds: [
					{
						entityType: 'DEVICE',
						entityId: id,
						scope: 'LATEST_TELEMETRY',
						cmdId: 1
					}
				],
				historyCmds: [],
				entityDataCmds: [],
				entityDataUnsubscribeCmds: [],
				alarmDataCmds: [],
				alarmDataUnsubscribeCmds: [],
				entityCountCmds: [],
				entityCountUnsubscribeCmds: []
			}),
			success() {
				console.log('发送成功了');
			}
		});
		// 隐藏原生的tabbar'
		uni.hideTabBar();
	},
	methods: {
		handleTabClick({ index }) {
			this.currentTab = index;
		}
	}
};
</script>