<template>
	<view class="container">
		<view class="liebiaos" v-if="list.length">
			<scroll-view :style="{height:scorllheight + 'rpx'}" scroll-y="true" class="scroll-Y">
				<view class="list_item" v-for="(it,i) in list" :key="i">
						<view class="list_item_top">
							<view class="list_item_left">
								<image v-if="it[0].stationType == 'orient'" src="../../static/zd.png" mode=""></image>
								<image v-if="it[0].stationType == 'livestock'" src="../../static/zhandian_icon_xuqin.png" mode=""></image>
								<view class="item_right">
									<view class="right_top">
										{{it[0].stationName}}
									</view>
									<view class="right_bot">
										<image src="../../static/shebei_icon_shebei.png" mode=""></image>
										<view class="">设备数量：{{it.length}} 个</view>
									</view>
								</view>
							</view>
							<!-- <view class="state">
								<view class="">
									在线
								</view>
								<image src="../../static/zhandian_icon_zaixian .png" mode="" class="zt"></image>
							</view> -->
						</view>
						<view class="botcontent">
							<block v-for="(item,index) in it" :key="index">
								<view class="botcontent_left" @click="todetail(item,index)">
									<view class="botleft_left">
										<view class="botleftleft_top">
											<image :src="baseUrl + '/applet/common/static/' + item.deviceInfo.deviceIcon" mode=""></image>
										</view>
										<view class="botleftleft_bot">
											<view class="botleft_bottop">
												{{item.deployDes}}
											</view>
											<!-- <view class="botleft_botbot">
												型号：{{item.deviceInfo.deviceModel}}
											</view> -->
										</view>
									</view>
								</view>
							</block>
						</view>
				</view>
			</scroll-view>
		</view>
		<view class="zwsj" v-else>
			<view class="inzwsj">
				<image src="../../static/zwsj.png" mode="" class="zwsjimg"></image>
				<view class="zwsjtext">
					暂无数据
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import api from "@/api/api"
	import configService from '@/common/service/config.service.js';
	export default{
		data(){
			return{
				height:0,
				scorllheight:0,
				baseUrl:configService.apiUrl,
				allNum: '',
				isLastpage: '',
				intervalId: null,
				loadStatus:'more',  //加载样式：more-加载前样式，loading-加载中样式，nomore-没有数据样式
				isLoadMore:false,  //是否加载中
				show:false,
				show1:false,
				top:0,
				list:[],
				listsiol:[]
				}
		},
		onLoad() {
			uni.getSystemInfo({
				success: res => {
					var pxToRpxScale  = 750 / res.windowWidth
					var ktxStatusHeight = res.statusBarHeight * pxToRpxScale
					var navigationHeight = 44 * pxToRpxScale
					this.height = res.windowHeight  * pxToRpxScale//将px 转换rpx	
					this.scorllheight = this.height
				}
			});
			this.getList()
		},
		methods:{
			getList(){
			    uni.showLoading({
			        title: '加载中'
			    });
			    
			    // 使用 Promise.all 同时发起两个请求
			    Promise.all([
			        this.$http.get('/applet/survStationInfo/deviceList'),
			        this.$http.get('/applet/survStationInfo/fdeviceList')
			    ]).then(([res1, res2]) => {
			        const data1 = res1?.data?.data || [];
			        
			        // 安全获取第二个接口的数据
			        let data2 = [];
			        if (res2?.data?.data && Array.isArray(res2.data.data) && res2.data.data.length > 0) {
			            data2 = res2.data.data[0] || [];
			        }
			        
			        // data2 有数据才合并
			        this.list = data2.length > 0 ? data1.concat(data2) : data1;
			        
			        // 可选：打印日志方便调试
			        if (data2.length === 0) {
			            console.log('第二个接口无数据，跳过合并');
			        }
			        
			        uni.hideLoading();
			    }).catch(error => {
			        console.error('请求失败:', error);
			        uni.hideLoading();
			    });
			},
			todetail(item,index){
				uni.navigateTo({
					url:'/packDetail/pages/vidio/detail?item=' + encodeURIComponent(JSON.stringify(item))
				})
			}
		}
	}
</script>

<style lang="scss">
	page{
		height: 100%;
	}
	.container{
		height: 100%;
		// overflow-y: scroll;
		// overflow-x: hidden;
	}
	.bgimg{
		width: 100%;
		height: 3631rpx;
	}
	.liebiaos{
		padding: 28rpx 32rpx;
	}
	.list_item{
		width: 100%;
		padding: 37rpx 34rpx 28rpx;
		background: #FFFFFF;
		border-radius: 34rpx;
		margin-bottom: 25rpx;
		position: relative;
	}
	.list_item:last-child{
		margin-bottom: 0;
	}
	.list_item_top{
		display: flex;
		justify-content: space-between;
		align-items: center;
		width: 100%;
		margin-bottom: 25rpx;
	}
	.list_item_left{
		display: flex;
		align-items: center;
	}
	.list_item_left image{
		width: 73rpx;
		height: 73rpx;
		margin-right: 18rpx;
	}
	.item_right{
		height: 76rpx;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}
	.right_top{
		font-size: 32rpx;
		font-family: Source Han Sans SC;
		font-weight: 500;
		color: #2F3841;
	}
	.right_bot{
		display: flex;
		align-items: center;
		font-size: 24rpx;
		font-family: Source Han Sans SC;
		font-weight: 400;
		color: #9CA9BE;
	}
	.right_bot image{
		height: 26rpx;
		width: 24rpx;
		margin-right: 11rpx;
	}
	.jt{
		width: 40rpx;
		height: 48rpx;
	}
	.state{
		background: #F6F6F6;
		border-top-left-radius: 26rpx;
		border-bottom-left-radius: 26rpx;
		width: 171rpx;
		height: 52rpx;
		font-size: 24rpx;
		font-family: Source Han Sans SC;
		font-weight: 400;
		color: #5F7088;
		display: flex;
		align-items: center;
		padding-left: 24rpx;
		box-sizing: border-box;
		position: absolute;
		top: 31rpx;
		right: -32rpx;
	}
	.zt{
		width: 24rpx;
		height: 24rpx;
		margin-left: 18rpx;
	}
	.botcontent{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.botcontent_left{
		width: 48%;
		background: #F8F8F8;
		border-radius: 24rpx;
		padding: 44rpx 5rpx 44rpx 5rpx;
		margin-top: 20rpx;
	}
	.botcontent_left image{
		width: 61rpx;
		height: 61rpx;
	}
	.botleftleft_top{
		display: flex;
		justify-content: center;
		margin-bottom: 24rpx;
	}
	.botleftleft_top image{
		width: 65rpx;
		height: 65rpx;
	}
	.botleftleft_bot{
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.botleft_bottop{
		width: 70%;
		font-size: 28rpx;
		font-family: Source Han Sans SC;
		font-weight: 500;
		color: #333333;
		text-align: center;
	}
	.botleft_botbot{
		width: 60%;
		font-size: 24rpx;
		font-family: Source Han Sans SC;
		font-weight: 400;
		color: #9CA9BE;
		margin-top: 17rpx;
		word-break: break-all;
		// text-align: center;
	}
	.zwsj{
		width: 100%;
		height: 100%;
		display: flex;
		padding: 60% 170rpx 0;
	}
	.inzwsj{
		width: 100%;
	}
	.zwsjimg{
		width: 100%;
		height: 224rpx;
		margin-bottom: 37rpx;
	}
	.zwsjtext{
		width: 100%;
		font-size: 26rpx;
		font-family: Source Han Sans SC;
		font-weight: 400;
		color: #999999;
		line-height: 31rpx;
		text-align: center;
	}
</style>