<template>
	<view class="timeEnvironment">
		<u-navbar :background="background" :is-back='true' back-icon-color='#FFFFFF' :border-bottom="false" title="实时环境"
			title-color='#FFFFFF' :title-bold='true' title-size='32'></u-navbar>

		<view class="navbar">
			<image src="../../static/timeEnvironment_bg.png" mode=""></image>
		</view>

		<view class="content">
			<view class="title">
				<image src="../../static/logo_1.png" mode=""></image>
				<view class="right">
					<view class="">
						温室智慧云
					</view>
					<view class="">
						Greenhouse wisdom Cloud
					</view>
				</view>
			</view>

			<view class="subtitle">
				欢迎使用温室智慧云数据统计
			</view>

			<!-- 以下是单独调接口的气象数据 -->
			<template v-for="item0 in weatherList">
				<view class="waterAndFertilizerParams" :key="item0.id">
					<view class="nav">
						<view class="name"><image src="../../static/PH.png" mode=""></image>
						<text>{{item0.deviceName}}</text></view>
					</view>
					<view class="detail">
						<view class="item" v-for="item,index in item0.weatherListChild" :key="index"
							@click="toTarget_water_fertilizer_PH(item.equipmentId,item.environmentData,item.environmentDataId,item.equipmentNumber,item.targetValue,getTypeList(item.formula),item.equipmentName,1)">
							<image :src="`../../static/icon_new/icon${ item.formula }.png`" mode=""></image>
							<view class="info">
								<view class="">
									{{ item.environmentDataId }}
								</view>
								<view class="" :style="item.equipmentStart == 0 ? 'color:red':''">
									{{ item.equipmentStart == 0 ? '故障' : ((item.formula == '12' ? getWindDirection(item.environmentData) : item.environmentData) + (item.formula == '12' ? '' : getTypeList(item.formula))) }}
								</view>
							</view>
						</view>
					</view>
					<view class="line" v-if="item0.weatherListChild.length > 0"></view>
					<view class="updateTime">
						<span></span>
						<span>*更新数据时间&nbsp;:
							&nbsp;{{ (updateTimeWeather.filter(el=> el.equipmentId == item0.deviceId)).length > 0 ? (updateTimeWeather.filter(el=> el.equipmentId == item0.deviceId))[0].updateTime : '暂无'}}</span>
					</view>
				</view>
			</template>

			<!-- 以下是通过userid调取的气象数据 -->
			<template v-for="item0 in equipmentName30List">
				<view class="waterAndFertilizerParams" :key="item0.id">
					<view class="nav">
						<view class="name">
							<image src="../../static/PH.png" mode=""></image>
							<text>{{item0.deviceTypeName}}</text>
						</view>
					</view>
					<view class="detail">
						<view class="item" v-for="item,index in item0.equipmentName30ListChild" :key="index"
							@click="toTarget_water_fertilizer_PH(item.equipmentId,item.environmentData,item.environmentDataId,item.equipmentNumber,item.targetValue,getTypeList(item.formula),item.equipmentName,1)">
							<image :src="`../../static/icon_new/icon${ item.formula }.png`" mode=""></image>
							<view class="info">
								<view class="">
									{{ item.environmentDataId }}
								</view>
								<view class="" :style="item.equipmentStart == 0 ? 'color:red':''">
									{{ item.equipmentStart == 0 ? '故障' : ((item.formula == '12' ? getWindDirection(item.environmentData) : item.environmentData) + (item.formula == '12' ? '' : getTypeList(item.formula))) }}
								</view>
							</view>
						</view>
					</view>
					<view class="line" v-if="item0.equipmentName30ListChild.length > 0"></view>
					<view class="updateTime">
						<span></span>
						<span>*更新数据时间&nbsp;:
							&nbsp;{{ (updateTime30.filter(el=> el.equipmentId == item0.deviceId)).length > 0 ? (updateTime30.filter(el=> el.equipmentId == item0.deviceId))[0].updateTime : '暂无'}}</span>
					</view>
				</view>
			</template>
			<!-- 智能灌溉 -->
			<template v-for="item0 in equipmentName20List">
				<view class="waterAndFertilizerParams" :key="item0.id">
					<view class="nav iccid-nav">
						<view class="name">
							<image src="../../static/PH.png" mode=""></image>
							<text>{{item0.deviceTypeName}}</text>
						</view>
						<view class="iccid">卡号:{{item0.iccidcode}}<br>
						到期时间:<text :class="getPackageTimeColor(item0.iccidcode)?'color-red':''">{{getPackageTime(item0.iccidcode)}}<text v-if="getPackageTimeColor(item0.iccidcode)">(即将到期)</text></text></view>
					</view>
					<view class="detail">
						<view class="item" v-for="item,index in item0.equipmentName20ListChild" :key="index"
							@click="toTarget_water_fertilizer_PH(item.equipmentId,item.environmentData,item.environmentDataId,item.equipmentNumber,item.targetValue,getTypeList(item.formula),item.equipmentName,2)">
							<image :src="`../../static/icon_new/icon${ item.formula }.png`" mode=""></image>
							<view class="info">
								<view class="">
									{{ getStatus(item.equipmentNumber,item.targetValue) + item.environmentDataId }}
								</view>
								<view class="" :style="item.equipmentStart == 0 ? 'color:red':''">
									{{ item.equipmentStart == 0 ? '故障' : ((item.formula == '12' ? getWindDirection(item.environmentData) : item.environmentData) + (item.formula == '12' ? '' : getTypeList(item.formula))) }}
								</view>
							</view>
						</view>
					</view>
					<view class="line" v-if="item0.equipmentName20ListChild.length > 0"></view>
					<view class="updateTime">
						<span></span>
						<span>*更新数据时间&nbsp;:
							&nbsp;{{ (updateTime20.filter(el=> el.equipmentId == item0.deviceId)).length > 0 ? (updateTime20.filter(el=> el.equipmentId == item0.deviceId))[0].updateTime : '暂无'}}</span>
					</view>
				</view>
			</template>
			
			<view class="waterAndFertilizerParams" v-for="(item1,index1) in waterAndFertilizerParamsList" :key="index1">
				<view class="nav iccid-nav">
					<view class="name">
						<image src="../../static/PH.png" mode=""></image>
						<text>{{ item1.deviceTypeName }}</text>
					</view>
						<view  class="iccid">卡号:{{item1.iccidcode}}<br> 
						到期时间:<text :class="getPackageTimeColor(item1.iccidcode)?'color-red':''">{{getPackageTime(item1.iccidcode)}}<text v-if="getPackageTimeColor(item1.iccidcode)">(即将到期)</text></text></view>
				</view>
				<view class="detail">
					<view class="item" v-for="(item2,index2) in item1.childList_mubiao" :key="index2"
						@click="toTarget_water_fertilizer_PH(item2.equipmentId,item2.environmentData,item2.environmentDataId,item2.equipmentNumber,item2.targetValue,getTypeList(item2.formula),item2.equipmentName)">
						<image :src="`../../static/icon_new/icon${ item2.formula }.png`" mode=""></image>
						<view class="info">
							<view class="">
								{{ getStatus(item2.equipmentNumber,item2.targetValue) + item2.environmentDataId }}
							</view>
							<view class="" :style="item2.equipmentStart == 0 ? 'color:red':''">
								{{ item2.equipmentStart == 0 ? '故障' : (item2.environmentData + getTypeList(item2.formula)) }}
							</view>
						</view>
					</view>
					<view class="line" v-if="item1.childList_mubiao.length > 0"></view>


					<view class="item" v-for="(item2,index2) in item1.childList_1" :key="index2"
						@click="toTarget_water_fertilizer_PH(item2.equipmentId,item2.environmentData,item2.environmentDataId,item2.equipmentNumber,item2.targetValue,getTypeList(item2.formula),item2.equipmentName)">
						<image :src="`../../static/icon_new/icon${ item2.formula }.png`" mode=""></image>
						<view class="info">
							<view class="">
								{{ getStatus(item2.equipmentNumber,item2.targetValue) + item2.environmentDataId }}
							</view>
							<view class="" :style="item2.equipmentStart == 0 ? 'color:red':''">
								{{ item2.equipmentStart == 0 ? '故障' : item2.environmentData + getTypeList(item2.formula) }}
							</view>
						</view>
					</view>
					<view class="line" v-if="item1.childList_1.length > 0"></view>

					<view class="item" v-for="(item2,index2) in item1.childList_one" :key="index2"
						@click="toTarget_water_fertilizer_PH(item2.equipmentId,item2.environmentData,item2.environmentDataId,item2.equipmentNumber,item2.targetValue,getTypeList(item2.formula),item2.equipmentName)">
						<image :src="`../../static/icon_new/icon${ item2.formula }.png`" mode=""></image>
						<view class="info">
							<view class="">
								{{ getStatus(item2.equipmentNumber,item2.targetValue) + item2.environmentDataId }}
							</view>
							<view class="" :style="item2.equipmentStart == 0 ? 'color:red':''">
								{{ item2.equipmentStart == 0 ? '故障' : item2.environmentData + getTypeList(item2.formula) }}
							</view>
						</view>
					</view>
					<view class="line" v-if="item1.childList_one.length > 0"></view>

					<view class="item" v-for="(item2,index2) in item1.childList_2" :key="index2"
						@click="toTarget_water_fertilizer_PH(item2.equipmentId,item2.environmentData,item2.environmentDataId,item2.equipmentNumber,item2.targetValue,getTypeList(item2.formula),item2.equipmentName)">
						<image :src="`../../static/icon_new/icon${ item2.formula }.png`" mode=""></image>
						<view class="info">
							<view class="">
								{{ getStatus(item2.equipmentNumber,item2.targetValue) + item2.environmentDataId }}
							</view>
							<view class="" :style="item2.equipmentStart == 0 ? 'color:red':''">
								{{ item2.equipmentStart == 0 ? '故障' : item2.environmentData + getTypeList(item2.formula) }}
							</view>
						</view>
					</view>
					<view class="line" v-if="item1.childList_2.length > 0"></view>

					<view class="item" v-for="(item2,index2) in item1.childList_two" :key="index2"
						@click="toTarget_water_fertilizer_PH(item2.equipmentId,item2.environmentData,item2.environmentDataId,item2.equipmentNumber,item2.targetValue,getTypeList(item2.formula),item2.equipmentName)">
						<image :src="`../../static/icon_new/icon${ item2.formula }.png`" mode=""></image>
						<view class="info">
							<view class="">
								{{ getStatus(item2.equipmentNumber,item2.targetValue) + item2.environmentDataId }}
							</view>
							<view class="" :style="item2.equipmentStart == 0 ? 'color:red':''">
								{{ item2.equipmentStart == 0 ? '故障' : item2.environmentData + getTypeList(item2.formula) }}
							</view>
						</view>
					</view>
					<view class="line" v-if="item1.childList_two.length > 0"></view>

					<view class="item" v-for="(item2,index2) in item1.childList_three" :key="index2"
						@click="toTarget_water_fertilizer_PH(item2.equipmentId,item2.environmentData,item2.environmentDataId,item2.equipmentNumber,item2.targetValue,getTypeList(item2.formula),item2.equipmentName)">
						<image :src="`../../static/icon_new/icon${ item2.formula }.png`" mode=""></image>
						<view class="info">
							<view class="">
								{{ getStatus(item2.equipmentNumber,item2.targetValue) + item2.environmentDataId }}
							</view>
							<view class="" :style="item2.equipmentStart == 0 ? 'color:red':''">
								{{ item2.equipmentStart == 0 ? '故障' : item2.environmentData + getTypeList(item2.formula) }}
							</view>
						</view>
					</view>
					<view class="line" v-if="item1.childList_three.length > 0"></view>

					<view class="item" v-for="(item2,index2) in item1.childList_four" :key="index2"
						@click="toTarget_water_fertilizer_PH(item2.equipmentId,item2.environmentData,item2.environmentDataId,item2.equipmentNumber,item2.targetValue,getTypeList(item2.formula),item2.equipmentName)">
						<image :src="`../../static/icon_new/icon${ item2.formula }.png`" mode=""></image>
						<view class="info">
							<view class="">
								{{ getStatus(item2.equipmentNumber,item2.targetValue) + item2.environmentDataId }}
							</view>
							<view class="" :style="item2.equipmentStart == 0 ? 'color:red':''">
								{{ item2.equipmentStart == 0 ? '故障' : item2.environmentData + getTypeList(item2.formula) }}
							</view>
						</view>
					</view>
					<view class="line" v-if="item1.childList_four.length > 0"></view>

					<view class="item" v-for="(item2,index2) in item1.childList_five" :key="index2"
						@click="toTarget_water_fertilizer_PH(item2.equipmentId,item2.environmentData,item2.environmentDataId,item2.equipmentNumber,item2.targetValue,getTypeList(item2.formula),item2.equipmentName)">
						<image :src="`../../static/icon_new/icon${ item2.formula }.png`" mode=""></image>
						<view class="info">
							<view class="">
								{{ getStatus(item2.equipmentNumber,item2.targetValue) + item2.environmentDataId }}
							</view>
							<view class="" :style="item2.equipmentStart == 0 ? 'color:red':''">
								{{ item2.equipmentStart == 0 ? '故障' : item2.environmentData + getTypeList(item2.formula) }}
							</view>
						</view>
					</view>
					<view class="line" v-if="item1.childList_five.length > 0"></view>

					<view class="item" v-for="(item2,index2) in item1.childList_six" :key="index2"
						@click="toTarget_water_fertilizer_PH(item2.equipmentId,item2.environmentData,item2.environmentDataId,item2.equipmentNumber,item2.targetValue,getTypeList(item2.formula),item2.equipmentName)">
						<image :src="`../../static/icon_new/icon${ item2.formula }.png`" mode=""></image>
						<view class="info">
							<view class="">
								{{ getStatus(item2.equipmentNumber,item2.targetValue) + item2.environmentDataId }}
							</view>
							<view class="" :style="item2.equipmentStart == 0 ? 'color:red':''">
								{{ item2.equipmentStart == 0 ? '故障' : item2.environmentData + getTypeList(item2.formula) }}
							</view>
						</view>
					</view>
					<view class="line" v-if="item1.childList_six.length > 0"></view>

					<view class="item" v-for="(item2,index2) in item1.childList_seven" :key="index2"
						@click="toTarget_water_fertilizer_PH(item2.equipmentId,item2.environmentData,item2.environmentDataId,item2.equipmentNumber,item2.targetValue,getTypeList(item2.formula),item2.equipmentName)">
						<image :src="`../../static/icon_new/icon${ item2.formula }.png`" mode=""></image>
						<view class="info">
							<view class="">
								{{ getStatus(item2.equipmentNumber,item2.targetValue) + item2.environmentDataId }}
							</view>
							<view class="" :style="item2.equipmentStart == 0 ? 'color:red':''">
								{{ item2.equipmentStart == 0 ? '故障' : item2.environmentData + getTypeList(item2.formula) }}
							</view>
						</view>
					</view>
					<view class="line" v-if="item1.childList_seven.length > 0"></view>

					<view class="item" v-for="(item2,index2) in item1.childList_eight" :key="index2"
						@click="toTarget_water_fertilizer_PH(item2.equipmentId,item2.environmentData,item2.environmentDataId,item2.equipmentNumber,item2.targetValue,getTypeList(item2.formula),item2.equipmentName)">
						<image :src="`../../static/icon_new/icon${ item2.formula }.png`" mode=""></image>
						<view class="info">
							<view class="">
								{{ getStatus(item2.equipmentNumber,item2.targetValue) + item2.environmentDataId }}
							</view>
							<view class="" :style="item2.equipmentStart == 0 ? 'color:red':''">
								{{ item2.equipmentStart == 0 ? '故障' : item2.environmentData + getTypeList(item2.formula) }}
							</view>
						</view>
					</view>
					<view class="line" v-if="item1.childList_eight.length > 0"></view>

					<view class="item" v-for="(item2,index2) in item1.childList_nine" :key="index2"
						@click="toTarget_water_fertilizer_PH(item2.equipmentId,item2.environmentData,item2.environmentDataId,item2.equipmentNumber,item2.targetValue,getTypeList(item2.formula),item2.equipmentName)">
						<image :src="`../../static/icon_new/icon${ item2.formula }.png`" mode=""></image>
						<view class="info">
							<view class="">
								{{ getStatus(item2.equipmentNumber,item2.targetValue) + item2.environmentDataId }}
							</view>
							<view class="" :style="item2.equipmentStart == 0 ? 'color:red':''">
								{{ item2.equipmentStart == 0 ? '故障' : item2.environmentData + getTypeList(item2.formula) }}
							</view>
						</view>
					</view>
					<view class="line" v-if="item1.childList_nine.length > 0"></view>

					<view class="item" v-for="(item2,index2) in item1.childList_ten" :key="index2"
						@click="toTarget_water_fertilizer_PH(item2.equipmentId,item2.environmentData,item2.environmentDataId,item2.equipmentNumber,item2.targetValue,getTypeList(item2.formula),item2.equipmentName)">
						<image :src="`../../static/icon_new/icon${ item2.formula }.png`" mode=""></image>
						<view class="info">
							<view class="">
								{{ getStatus(item2.equipmentNumber,item2.targetValue) + item2.environmentDataId }}
							</view>
							<view class="" :style="item2.equipmentStart == 0 ? 'color:red':''">
								{{ item2.equipmentStart == 0 ? '故障' : item2.environmentData + getTypeList(item2.formula) }}
							</view>
						</view>
					</view>
					<view class="line" v-if="item1.childList_ten.length > 0"></view>

					<view class="item" v-for="(item2,index2) in item1.childList_eleven" :key="index2"
						@click="toTarget_water_fertilizer_PH(item2.equipmentId,item2.environmentData,item2.environmentDataId,item2.equipmentNumber,item2.targetValue,getTypeList(item2.formula),item2.equipmentName)">
						<image :src="`../../static/icon_new/icon${ item2.formula }.png`" mode=""></image>
						<view class="info">
							<view class="">
								{{ getStatus(item2.equipmentNumber,item2.targetValue) + item2.environmentDataId }}
							</view>
							<view class="" :style="item2.equipmentStart == 0 ? 'color:red':''">
								{{ item2.equipmentStart == 0 ? '故障' : item2.environmentData + getTypeList(item2.formula) }}
							</view>
						</view>
					</view>
					<view class="line" v-if="item1.childList_eleven.length > 0"></view>

					<view class="item" v-for="(item2,index2) in item1.childList_twelve" :key="index2"
						@click="toTarget_water_fertilizer_PH(item2.equipmentId,item2.environmentData,item2.environmentDataId,item2.equipmentNumber,item2.targetValue,getTypeList(item2.formula),item2.equipmentName)">
						<image :src="`../../static/icon_new/icon${ item2.formula }.png`" mode=""></image>
						<view class="info">
							<view class="">
								{{ getStatus(item2.equipmentNumber,item2.targetValue) + item2.environmentDataId }}
							</view>
							<view class="" :style="item2.equipmentStart == 0 ? 'color:red':''">
								{{ item2.equipmentStart == 0 ? '故障' : item2.environmentData + getTypeList(item2.formula) }}
							</view>
						</view>
					</view>
					<view class="line" v-if="item1.childList_twelve.length > 0"></view>

					<view class="item" v-for="(item2,index2) in item1.childList_thirteen" :key="index2"
						@click="toTarget_water_fertilizer_PH(item2.equipmentId,item2.environmentData,item2.environmentDataId,item2.equipmentNumber,item2.targetValue,getTypeList(item2.formula),item2.equipmentName)">
						<image :src="`../../static/icon_new/icon${ item2.formula }.png`" mode=""></image>
						<view class="info">
							<view class="">
								{{ getStatus(item2.equipmentNumber,item2.targetValue) + item2.environmentDataId }}
							</view>
							<view class="" :style="item2.equipmentStart == 0 ? 'color:red':''">
								{{ item2.equipmentStart == 0 ? '故障' : item2.environmentData + getTypeList(item2.formula) }}
							</view>
						</view>
					</view>
					<view class="line" v-if="item1.childList_thirteen.length > 0"></view>

					<view class="item" v-for="(item2,index2) in item1.childList_fourteen" :key="index2"
						@click="toTarget_water_fertilizer_PH(item2.equipmentId,item2.environmentData,item2.environmentDataId,item2.equipmentNumber,item2.targetValue,getTypeList(item2.formula),item2.equipmentName)">
						<image :src="`../../static/icon_new/icon${ item2.formula }.png`" mode=""></image>
						<view class="info">
							<view class="">
								{{ getStatus(item2.equipmentNumber,item2.targetValue) + item2.environmentDataId }}
							</view>
							<view class="" :style="item2.equipmentStart == 0 ? 'color:red':''">
								{{ item2.equipmentStart == 0 ? '故障' : item2.environmentData + getTypeList(item2.formula) }}
							</view>
						</view>
					</view>
					<view class="line" v-if="item1.childList_fourteen.length > 0"></view>

				</view>
				<view class="updateTime">
					<span></span>
					<span>*更新数据时间&nbsp;:
						&nbsp;{{ (updateTime.filter(el=> el.equipmentId == item1.deviceId)).length > 0 ? (updateTime.filter(el=> el.equipmentId == item1.deviceId))[0].updateTime : '暂无'}}</span>
				</view>
			</view>
			<!-- 数据采集器 -->
			<template v-for="item0 in equipmentName40List">
				<view class="waterAndFertilizerParams" :key="item0.id">
					<view class="nav iccid-nav">
						<view class="name">
							<image src="../../static/PH.png" mode=""></image>
							<text>{{item0.deviceTypeName}}</text>
						</view>
						<view class="iccid">卡号:{{item0.iccidcode}}<br> 
						到期时间:<text :class="getPackageTimeColor(item0.iccidcode)?'color-red':''">{{getPackageTime(item0.iccidcode)}}<text v-if="getPackageTimeColor(item0.iccidcode)">(即将到期)</text></text></view>
					</view>
					<view class="detail">
						<view class="item" v-for="item,index in item0.equipmentName40ListChild" :key="index"
							@click="toTarget_water_fertilizer_PH(item.equipmentId,item.environmentData,item.environmentDataId,item.equipmentNumber,item.targetValue,getTypeList(item.formula),item.equipmentName,2)">
							<image :src="`../../static/icon_new/icon${ item.formula }.png`" mode=""></image>
							<view class="info">
								<view class="">
									{{ getStatus(item.equipmentNumber,item.targetValue) + item.environmentDataId }}
								</view>
								<view class="" :style="item.equipmentStart == 0 ? 'color:red':''">
									{{ item.equipmentStart == 0 ? '故障' : ((item.formula == '12' ? getWindDirection(item.environmentData) : item.environmentData) + (item.formula == '12' ? '' : getTypeList(item.formula))) }}
								</view>
							</view>
						</view>
					</view>
					<view class="line" v-if="item0.equipmentName40ListChild.length > 0"></view>
					<view class="updateTime">
						<span></span>
						<span>*更新数据时间&nbsp;:
							&nbsp;{{ (updateTime40.filter(el=> el.equipmentId == item0.deviceId)).length > 0 ? (updateTime40.filter(el=> el.equipmentId == item0.deviceId))[0].updateTime : '暂无'}}</span>
					</view>
				</view>
			</template>
			<u-toast ref="uToast" />
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// iccid物联网卡号数组
				iccidList:[],
				// 头部导航背景
				background: {
					backgroundColor: 'transparent',
				},
				// 水肥参数
				waterAndFertilizerParamsList: [

				],

				// 测试基地
				testBaseList: [{
						img: "../../static/base1.png",
						name: '空气温度',
						value: "38.8klux"
					},
					{
						img: "../../static/base2.png",
						name: '光亮度',
						value: "38.8klux"
					},
					{
						img: "../../static/base3.png",
						name: '二氧化碳',
						value: "二氧化碳"
					},
					{
						img: "../../static/base3.png",
						name: '二氧化碳',
						value: "678PPM"
					},
					{
						img: "../../static/base4.png",
						name: '土壤温度',
						value: "20℃"
					},
					{
						img: "../../static/base4.png",
						name: '土壤温度',
						value: "30.1℃"
					},
					{
						img: "../../static/base5.png",
						name: '土壤湿度',
						value: "18.5%"
					},
					{
						img: "../../static/base5.png",
						name: '土壤湿度',
						value: "18.5%"
					},
					{
						img: "../../static/base6.png",
						name: '水肥PH',
						value: "0"
					},
					{
						img: "../../static/base6.png",
						name: '水肥EC',
						value: "0.2mS/cm"
					},
					{
						img: "../../static/base7.png",
						name: '3#空气温度',
						value: "29.8C"
					},
					{
						img: "../../static/base8.png",
						name: '3#空气湿度',
						value: "80.6%"
					},
					{
						img: "../../static/base2.png",
						name: '3#光亮度',
						value: "34.6 klux"
					},
					{
						img: "../../static/base3.png",
						name: '3#二氧化碳',
						value: "29.8C"
					},
					{
						img: "../../static/base5.png",
						name: '3#土壤温度',
						value: "31℃"
					},
				],

				// 测试基地
				testBaseList1: [{
						img: "../../static/1.png",
						name: '4#光亮度',
						value: "43 klux"
					},
					{
						img: "../../static/2.png",
						name: '4#二氧化碳',
						value: "742 PPM"
					},
					{
						img: "../../static/3.png",
						name: '4#土壤温度',
						value: "29.3C"
					},
					{
						img: "../../static/4.png",
						name: '4#土壤湿度',
						value: "4%"
					},
				],


				//label是名称  value是code码  
				//countType计算类型 0是原数据 1是原数据-400 2是原数据/10 3是(原数据-400) / 10
				typeList: [],

				timer: null,
				updateTime: [],

				weatherList: [],
				weatherDeviceName: '',
				updateTimeWeather: [],

				equipmentName30List: [],
				equipmentName30ListChild: [],
				equipmentName20List: [],
				equipmentName20ListChild: [],
				equipmentName40List: [],
				equipmentName40ListChild: [],
				updateTime30: [],
				updateTime20: [],
				updateTime40: [],
			}
		},
		onLoad() {
			this.typeList = this.api.typeList
			uni.showLoading({
				title: '加载中...'
			});
			let that = this
			uni.getStorage({
				key: 'token',
				success: function(res) {
					that.getEquipmentInfo(uni.getStorageSync('userid'),true);
					that.getcontrol_geteqetdata(uni.getStorageSync('userid'))
				},
				fail: function(err) {
					uni.reLaunch({
						url: '/pages/login/login'
					})
				}
			})
		},
		onShow() {
			// console.log('timeEnvironment');
			let that = this
			clearInterval(that.timer) && that.timer
			this.timer = setInterval(function() {
				uni.getStorage({
					key: 'token',
					success: function(res) {
						that.getEquipmentInfo(uni.getStorageSync('userid'),false)
						that.getcontrol_geteqetdata(uni.getStorageSync('userid'))
					},
				})
			}, 60000);
		},
		onHide() {
			let that = this
			clearInterval(that.timer) && that.timer
		},
		onPullDownRefresh() {
			uni.showLoading({
				title: '加载中...'
			});
			let that = this
			uni.getStorage({
				key: 'token',
				success: function(res) {
					that.getEquipmentInfo(uni.getStorageSync('userid'),true)
					that.getcontrol_geteqetdata(uni.getStorageSync('userid'))
				},
			})
		},
		mounted() {
			// uni.showLoading({
			// 	title: '加载中...'
			// });
			// let that = this
			// uni.getStorage({
			// 	key: 'token',
			// 	success: function(res) {
			// 		that.getEquipmentInfo(uni.getStorageSync('userid'));
			// 		that.getcontrol_geteqetdata(uni.getStorageSync('userid'))
			// 	},
			// 	fail: function(err) {
			// 		uni.reLaunch({
			// 			url: '/pages/login/login'
			// 		})
			// 	}
			// })

		},
		methods: {
			// 根据用户id查询对应的设备数据
			getEquipmentInfo(userid,selTrue) {
				let that = this
				// uni.showLoading({
				// 	title: '加载中...'
				// });
				this.$http({
					url: this.api.sel_userbyid + userid,
					// url: this.api.sel_eqbyid + '1730755572975824896',
					method: 'GET'
				}).then(res1 => {
					// console.log(res, '根据用户id查询对应的设备数据');
					if (res1.code == 200) {
						this.equipmentName30List = [];
						this.equipmentName20List = [];
						this.equipmentName40List = [];
						// 根据id卡号调取物联网卡号到期时间
						if(selTrue){
						this.getQibenGeticcid(res1.data.devices)
						 }
						res1.data.devices.forEach(el => {
							// 气象站
							if (el.deviceName == 30) {
								this.equipmentName30List.push(el)
							}
							if (el.deviceName == 20) {
								this.equipmentName20List.push(el)
							}
							// 数据采集器
							if (el.deviceName == 40) {
								this.equipmentName40List.push(el)
							}
						})
						// 数据采集器
						if (this.equipmentName40List.length != 0) {
							this.getcontrol_rtDatastation40()
						}
						// 气象站
						if (this.equipmentName30List.length != 0) {
							this.getcontrol_rtDatastation30()
						}
						if (this.equipmentName20List.length != 0) {
							this.getFi_rtdata()
						}
						this.waterAndFertilizerParamsList = res1.data.devices.map((item, index) => {
							return {
								...item,
								childList: [],
								childList_mubiao: [], //目标
								childList_1: [], //平均
								childList_2: [], //平均
								childList_one: [], //1#
								childList_two: [], //2#
								childList_three: [], //3#
								childList_four: [], //4#
								childList_five: [], //5#
								childList_six: [], //6#
								childList_seven: [], //7#
								childList_eight: [], //8#
								childList_nine: [], //9#
								childList_ten: [], //10#
								childList_eleven: [], //11#
								childList_twelve: [], //12#
								childList_thirteen: [], //13#
								childList_fourteen: [], //14#
							}
						})
						this.updateTime = []
						this.waterAndFertilizerParamsList.forEach((i, index) => {
							this.$http({
								url: (i.deviceName == 1 ? this.api.getFs_rtdata : this.api
									.getcontrol_rtdata) + "?equipmentId=" + i.deviceId,
								method: 'post',
							}).then(res => {
								uni.hideLoading({
									title: '完成'
								});
								if (res.code == 200 && res.data.length != 0) {
									// uni.hideLoading({
									// 	title: '完成'
									// });
									uni.stopPullDownRefresh();
									i.childList = res.data;
									i.childList_mubiao = res.data.filter(el => (this.getStatus(el
											.equipmentNumber, el.targetValue)) == '目标' || (this
											.getStatus(el.equipmentNumber, el.targetValue)) ==
										('目标' + el.equipmentNumber + '#'));
									i.childList_1 = res.data.filter(el => (this.getStatus(el
										.equipmentNumber, el.targetValue)) == '1#平均');
									i.childList_2 = res.data.filter(el => (this.getStatus(el
										.equipmentNumber, el.targetValue)) == '2#平均');

									i.childList_one = res.data.filter(el => (this.getStatus(el
										.equipmentNumber, el.targetValue)) == (el
										.equipmentNumber + '#') && el.equipmentNumber == 1);
									// i.childList_one = [...i.childList_1,...i.childList_one];
									i.childList_two = res.data.filter(el => (this.getStatus(el
										.equipmentNumber, el.targetValue)) == (el
										.equipmentNumber + '#') && el.equipmentNumber == 2);
									// i.childList_two = [...i.childList_2,...i.childList_two]
									i.childList_three = res.data.filter(el => (this.getStatus(el
										.equipmentNumber, el.targetValue)) == (el
										.equipmentNumber + '#') && el.equipmentNumber == 3);
									i.childList_four = res.data.filter(el => (this.getStatus(el
										.equipmentNumber, el.targetValue)) == (el
										.equipmentNumber + '#') && el.equipmentNumber == 4);
									i.childList_five = res.data.filter(el => (this.getStatus(el
										.equipmentNumber, el.targetValue)) == (el
										.equipmentNumber + '#') && el.equipmentNumber == 5);
									i.childList_six = res.data.filter(el => (this.getStatus(el
										.equipmentNumber, el.targetValue)) == (el
										.equipmentNumber + '#') && el.equipmentNumber == 6);
									i.childList_seven = res.data.filter(el => (this.getStatus(el
										.equipmentNumber, el.targetValue)) == (el
										.equipmentNumber + '#') && el.equipmentNumber == 7);
									i.childList_eight = res.data.filter(el => (this.getStatus(el
										.equipmentNumber, el.targetValue)) == (el
										.equipmentNumber + '#') && el.equipmentNumber == 8);
									i.childList_nine = res.data.filter(el => (this.getStatus(el
										.equipmentNumber, el.targetValue)) == (el
										.equipmentNumber + '#') && el.equipmentNumber == 9);
									i.childList_ten = res.data.filter(el => (this.getStatus(el
											.equipmentNumber, el.targetValue)) == (el
											.equipmentNumber + '#') && el.equipmentNumber ==
										10);
									i.childList_eleven = res.data.filter(el => (this.getStatus(el
											.equipmentNumber, el.targetValue)) == (el
											.equipmentNumber + '#') && el.equipmentNumber ==
										11);
									i.childList_twelve = res.data.filter(el => (this.getStatus(el
											.equipmentNumber, el.targetValue)) == (el
											.equipmentNumber + '#') && el.equipmentNumber ==
										12);
									i.childList_thirteen = res.data.filter(el => (this.getStatus(el
											.equipmentNumber, el.targetValue)) == (el
											.equipmentNumber + '#') && el.equipmentNumber ==
										13);
									i.childList_fourteen = res.data.filter(el => (this.getStatus(el
											.equipmentNumber, el.targetValue)) == (el
											.equipmentNumber + '#') && el.equipmentNumber ==
										14);


									this.updateTime.push(res.data[0])

									// console.log(this.waterAndFertilizerParamsList);
								} else {
									this.updateTime.push('暂无')
								}
								// console.log(this.updateTime,'this.updateTime'); 
							}).catch(err => {
								console.log('接口失败');
							})
						})
						// equipmentName==1的
						let waterAndFertilizerParamsList_1 = this.waterAndFertilizerParamsList.filter(e => e
							.deviceName == 1).sort((a, b) => a.equipmentStatu - b.equipmentStatu)

						// equipmentName==10的
						let waterAndFertilizerParamsList_10 = this.waterAndFertilizerParamsList.filter(e => e
							.deviceName == 10).sort((a, b) => a.equipmentStatu - b.equipmentStatu);

						// console.log(waterAndFertilizerParamsList_1,waterAndFertilizerParamsList_10,'00000000000');
						this.waterAndFertilizerParamsList = [...waterAndFertilizerParamsList_1, ...
							waterAndFertilizerParamsList_10
						];
						 
						                    
						// console.log(this.waterAndFertilizerParamsList, 'this.waterAndFertilizerParamsList');
					}
				})
			},

			getQibenGeticcid(devicesList){
			  var data=devicesList.map(device => ({
			  deviceId: device.deviceId,
			  iccid: device.iccidcode,
			  deviceName: device.deviceTypeName
			}));
			
			 var iccidList=[]
		
			 this.$http({
			 	url: this.api.popupwindow,
			 	data: {userId:uni.getStorageSync('userid')},
			 	method: 'GET'
			 }).then(res1=>{
			     data.forEach((el,index)=>{
						this.$http({
							url: this.api.qibenGeticcid ,
							data: el,
							method: 'POST'
						}).then(res=>{
						        if(res.code==200){
						           iccidList.push(res.data)
								   this.iccidList=iccidList
								   if(res1.data&&res.data.expired){
									   setTimeout(() => {
									   		this.$refs.uToast.show({
									   title: `${res.data.deviceName}卡号为${res.data.iccid},物联网卡即将到期，剩余时间${res.data.daysDifference}天，请联系管理员。`,
									   type: 'default',
									   duration:10000
									   })
									       }, 10);
								   }
						        }
						  })
				 })
			  })
			
			},
			  getPackageTime(iccidcode){
			           var item= this.iccidList.find(item=>item.iccid==iccidcode)
			
			          return item? item.packageTime:'无数据'
			        },
			         getPackageTimeColor(iccidcode){
			           var item= this.iccidList.find(item=>item.iccid==iccidcode)
			
			          return item? item.expired:false
			        },
			// 跳转到折线图
			toTarget_water_fertilizer_PH(id, data, name, equipmentNumber, targetValue, unit, equipmentName, flag) {
				uni.navigateTo({
					url: '/pages/target_water_fertilizer_PH/target_water_fertilizer_PH?id=' + id + '&data=' +
						data + '&name=' + name + '&equipmentNumber=' + equipmentNumber + '&targetValue=' +
						targetValue + '&unit=' + unit + '&equipmentName=' + equipmentName + '&flag=' + flag
				})
			},



			// 数据单位
			getTypeList(val) {
				let typeList1 = []
				typeList1 = this.typeList.filter(item => {
					return item.value == val
				})
				return typeList1[0].unit
			},

			// 判断是否是平均或者目标,或者是1#
			getStatus(equipmentNumber, targetValue) {
				// if (targetValue == 1) {
				// 	return '目标'
				// } else if (targetValue == 0 && equipmentNumber == 0) {
				// 	return '1#平均'
				// } else if (targetValue == 0 && equipmentNumber == 15) {
				// 	return '2#平均'
				// } else if (targetValue == 0 && equipmentNumber != 0 && equipmentNumber != 15) {
				// 	return equipmentNumber + '#'
				// }

				if (targetValue == 1) {
					if (equipmentNumber == 0) {
						return '目标'
					} else {
						return '目标' + equipmentNumber + '#'
					}
				} else {
					if (equipmentNumber == 0) {
						return '1#平均'
					} else if (equipmentNumber == 15) {
						return '2#平均'
					} else {
						return equipmentNumber + '#'
					}
				}

			},
			getStatusNew(el) {
				var name = ''
				if (el.equipmentName == 30) {
					if (el.targetValue == 1) {
						if (el.equipmentNumber == 0) {
							name = '目标' + el.environmentDataId
						} else {
							name = '目标' + el.equipmentNumber + '#' + el.environmentDataId
						}
					} else {
						if (el.equipmentNumber == 0) {
							name = '1#平均' + el.environmentDataId
						} else if (el.equipmentNumber == 15) {
							name = '2#平均' + el.environmentDataId
						} else {
							name = el.equipmentNumber + '#' + el.environmentDataId
						}
					}
				} else {
					name = el.environmentDataId
				}
				return name
			},
			// 气象站
			getcontrol_geteqetdata(userId) {
				this.$http({
					url: this.api.getcontrol_geteqetdata + '?userId=' + userId,
					method: 'GET'
				}).then(res => {
					// console.log(res,'小程序气象站显示');
					if (res.code == 200) {
						this.weatherList = res.data
						this.weatherList = this.weatherList.map((item, index) => {
							return {
								...item,
								weatherListChild: []
							}
						})
						this.updateTimeWeather = []
						this.weatherList.forEach(el => {
							// 主页查看控制器气象站实时数据 
							this.$http({
								url: this.api.getcontrol_rtDatastation + '?equipmentId=' + el
									.deviceId,
								method: 'GET'
							}).then(res1 => {
								// console.log(res,'主页查看控制器气象站实时数据');
								if (res1.code == 200) {
									res1.data.forEach((el1, index) => {
										el.weatherListChild.push({
											...el1,
											environmentDataId: this.getStatusNew(el1),
										})
									})
									this.updateTimeWeather.push(res1.data[0])
								
								}

							})
						})

					}

				})
			},

			// 主页查看控制器气象站实时数据 
			getcontrol_rtDatastation(equipmentId) {

			},
			// 获取deviceName为20的智能灌溉实时数据
			getFi_rtdata() {
				this.equipmentName20List = this.equipmentName20List.map((item, index) => {
					return {
						...item,
						equipmentName20ListChild: []
					}
				})

				this.updateTime20 = []
				this.equipmentName20List.forEach(el => {
					this.$http({
						url: this.api.getFi_rtdata + '?equipmentId=' + el.deviceId,
						method: 'GET'
					}).then(res => {
						if (res.code == 200) {
							console.log(res.data);
							el.equipmentName20ListChild = res.data;
							this.updateTime20.push(res.data[0] ? res.data[0] : [])

						}

					})
				})
				console.log(this.equipmentName20List);

			},
			// 获取deviceName为40的数据采集器实时数据
			getcontrol_rtDatastation40() {
				this.equipmentName40List = this.equipmentName40List.map((item, index) => {
					return {
						...item,
						equipmentName40ListChild: []
					}
				})
			
				this.updateTime40 = []
				this.equipmentName40List.forEach(el => {
					this.$http({
						url: this.api.getdata_rtdata + '?deviceId=' + el.deviceId,
						method: 'GET'
					}).then(res => {
						if (res.code == 200) {
							res.data.forEach((el1, index) => {
								el.equipmentName40ListChild.push({
									...el1,
									environmentDataId: this.getStatusNew(el1),
								})
							})
							this.updateTime40.push(res.data[0])
						}
			
					})
				})
				// console.log(this.equipmentName30List,'this.equipmentName30List');
			},
			// 获取deviceName为30的气象站实时数据
			getcontrol_rtDatastation30() {
				this.equipmentName30List = this.equipmentName30List.map((item, index) => {
					return {
						...item,
						equipmentName30ListChild: []
					}
				})

				this.updateTime30 = []
				this.equipmentName30List.forEach(el => {
					this.$http({
						url: this.api.getcontrol_rtDatastation + '?equipmentId=' + el.deviceId,
						method: 'GET'
					}).then(res => {
						if (res.code == 200) {
							res.data.forEach((el1, index) => {
								el.equipmentName30ListChild.push({
									...el1,
									environmentDataId: this.getStatusNew(el1),
								})
							})
							this.updateTime30.push(res.data[0])
						}

					})
				})
				// console.log(this.equipmentName30List,'this.equipmentName30List');
			},

			// 风向判定
			getWindDirection(number) {
				let num = Number(number)
				if (num <= 67 && num >= 22) {
					return '东北'
				} else if (num > 67 && num < 112) {
					return '东'
				} else if (num >= 112 && num <= 157) {
					return '东南'
				} else if (num > 157 && num < 202) {
					return '南'
				} else if (num >= 202 && num <= 247) {
					return '西南'
				} else if (num > 247 && num < 292) {
					return '西'
				} else if (num >= 292 && num <= 337) {
					return '西北'
				} else if (num < 22) {
					return '北'
				} else if (num > 337) {
					return '北'
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.color-red{
	    color: red!important; 
	}
	.timeEnvironment {
		width: 100%;
		min-height: 100vh;
		box-sizing: border-box;
		position: relative;
		background-color: #F5F6FA;
		overflow: auto;

		.navbar {
			width: 100%;
			height: 100%;

			>image {
				width: 750rpx;
				height: 500rpx;
				position: absolute;
				top: 0;
				left: 0;
			}
		}


		.content {
			position: absolute;
			z-index: 2;
			box-sizing: border-box;
			padding: 0rpx 30rpx 30rpx;


			.title {
				display: flex;
				align-items: center;

				>image {
					width: 71rpx;
					height: 65rpx;
				}

				.right {
					margin-left: 14rpx;

					>view:nth-child(1) {
						font-size: 44rpx;
						font-family: AlibabaPuHuiTiB;
						font-weight: bold;
						color: #FFFFFF;
					}

					>view:nth-child(2) {
						font-size: 16rpx;
						font-family: Arial-BoldMT;
						font-weight: bold;
						color: #FFFFFF;
						line-height: 20rpx;
						opacity: 0.5;
					}
				}
			}

			.subtitle {
				font-size: 30rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #FFFFFF;
				margin-top: 26rpx;
			}

			.waterAndFertilizerParams {
				width: 690rpx;
				height: auto;
				box-sizing: border-box;
				padding: 20rpx;
				background: #FFFFFF;
				box-shadow: 0rpx 4rpx 20rpx 0rpx rgba(153, 153, 153, 0.1);
				border-radius: 20rpx;
				margin-top: 69rpx;

				.nav {
					height: 90rpx;
					display: flex;
					align-items: center;
					border-bottom: 1rpx solid #DDDDDD;
					&.iccid-nav{
						display: flex;
						align-items: center;
						justify-content: space-between;
					}
					.name{
						image {
							width: 50rpx;
							height: 50rpx;
							margin-right: 16rpx;
						}
						
						text {
							font-size: 26rpx;
							font-family: PingFang SC;
							font-weight: bold;
							color: #333333;
							 white-space: nowrap;
						}
							display: flex;
							align-items: center;
						
					}
					
					.iccid{
						display: block;
							font-size: 24rpx;
						text{
							font-weight: normal;
						}
					}
				}

				.detail {
					width: 100%;
					height: calc(100% - 90rpx);
					box-sizing: border-box;
					padding: 10rpx 0rpx;
					display: flex;
					flex-wrap: wrap;
					// justify-content: space-evenly;

					.line {
						width: 100%;
						height: 1rpx;
						background-color: #DDDDDD;
						flex-shrink: 0;
						margin-top: 20rpx;
					}

					.item {
						width: 50%;
						display: flex;
						align-items: center;
						box-sizing: border-box;
						padding-left: 20rpx;
						margin-top: 30rpx;

						>image {
							width: 80rpx;
							height: 80rpx;
							margin-right: 19rpx;
						}

						.info {
							>view:nth-child(1) {
								font-size: 24rpx;
								font-family: PingFang SC;
								font-weight: bold;
								color: #333333;
							}

							>view:nth-child(2) {
								font-size: 30rpx;
								font-family: PingFang SC;
								font-weight: bold;
								color: #333333;
							}
						}
					}
				}

				.updateTime {
					width: 100%;
					display: flex;
					justify-content: space-between;
					align-items: center;
					margin-top: 20rpx;
					font-size: 22rpx;
				}
			}

			.testBase {
				width: 690rpx;
				height: auto;
				background: #FFFFFF;
				box-shadow: 0rpx 4rpx 20rpx 0rpx rgba(153, 153, 153, 0.1);
				border-radius: 20rpx;
				margin-top: 30rpx;


				.nav {
					height: 90rpx;
					box-sizing: border-box;
					padding: 20rpx;
					display: flex;
					align-items: center;

					>image {
						width: 50rpx;
						height: 50rpx;
						margin-right: 16rpx;
					}

					>text {
						font-size: 30rpx;
						font-family: PingFang SC;
						font-weight: bold;
						color: #333333;
					}
				}

				.detail {
					width: 100%;
					height: calc(100% - 90rpx);
					display: flex;
					flex-wrap: wrap;
					padding-bottom: 46rpx;

					.item {
						width: 33%;
						display: flex;
						align-items: center;
						justify-content: center;
						flex-direction: column;
						margin-top: 30rpx;


						>image {
							width: 60rpx;
							height: 60rpx;
						}

						.info {
							display: flex;
							flex-direction: column;
							justify-content: center;
							align-items: center;
							margin-top: 10rpx;

							>view:nth-child(1) {
								font-size: 24rpx;
								font-family: PingFang SC;
								font-weight: bold;
								color: #333333;
							}

							>view:nth-child(2) {
								font-size: 30rpx;
								font-family: PingFang SC;
								font-weight: bold;
								color: #333333;
							}
						}
					}
				}
			}

			.testBase1 {
				width: 690rpx;
				height: auto;
				background: #FFFFFF;
				box-shadow: 0rpx 4rpx 20rpx 0rpx rgba(153, 153, 153, 0.1);
				border-radius: 20rpx;
				margin-top: 30rpx;
				box-sizing: border-box;
				padding: 0 20rpx 1rpx;

				.nav {
					height: 90rpx;
					box-sizing: border-box;
					padding: 20rpx;
					display: flex;
					align-items: center;

					>image {
						width: 50rpx;
						height: 50rpx;
						margin-right: 16rpx;
					}

					>text:nth-child(2) {
						font-size: 30rpx;
						font-family: PingFang SC;
						font-weight: bold;
						color: #333333;
					}

					>text:nth-child(3) {
						width: 90rpx;
						height: 44rpx;
						background: #EFFCF7;
						border: 2px solid rgba(58, 187, 144, 0.25);
						border-radius: 22rpx;
						font-size: 20rpx;
						font-family: PingFang SC;
						font-weight: bold;
						color: #37BA8E;
						display: flex;
						justify-content: center;
						align-items: center;
						margin-left: 15rpx;
					}
				}

				.item {
					width: 650rpx;
					height: 90rpx;
					background: #F5F6FA;
					border: 2px solid #E7E9F1;
					border-radius: 10rpx;
					display: flex;
					align-items: center;
					justify-content: space-between;
					margin-bottom: 30rpx;
					box-sizing: border-box;
					padding: 0 30rpx 0 20rpx;

					>image {
						width: 40rpx;
						height: 39rpx;
						margin-right: 20rpx;
					}

					>text:nth-child(2) {
						flex: 1;
						font-size: 28rpx;
						font-family: PingFang SC;
						font-weight: bold;
						color: #333333;
					}

					>text:nth-child(3) {
						font-size: 30rpx;
						font-family: PingFang SC;
						font-weight: bold;
						color: #333333;
					}
				}
			}
		}
	}

	.line {
		width: 100%;
		height: 1rpx;
		background-color: #DDDDDD;
		flex-shrink: 0;
		margin-top: 20rpx;
	}
</style>