sisMobilePhone/pages/index/Index.vue

<template>
	<view class="content">
		<!-- <image class="logo" src="/static/logo.png"></image> -->
		<!--导航栏-->
		<view @tap="common.navTo('/components/addressSelect/AddressSelect?option='+address)">
			<cu-custom bgColor="bg-gradual-earkblue" :isBack="false">
				<block slot="backText">
					<view style="height: 80rpx;line-height: 80rpx;">返回</view>
				</block>
				<block slot="content">
					<text :class="'cuIcon-locationfill'"></text>
				</block>
				<block slot="content">{{address}}</block>
				<block slot="content">
					<image style="width: 15px;height: 15px;margin-left: 4px;" src="../../static/picture/SanJiao.png">
				</block>
			</cu-custom>
		</view>
		<div class="ThermometerCard">
			<!-- <scroll-view scroll-y scroll-with-animation  class="scrollList"> -->
			<ThermometerCard ref="thermometerCard" @listenEven="weatherDayNightSwitch"></ThermometerCard>
			<!-- </scroll-view> -->
		</div>
		<div class="weatherDetails">
			<div class="weatherText" :style="{'margin-left':marginleftBiao}"><strong>气象指标</strong></div>
			<div class="detailsText" @tap="common.navTo('/components/detail/Detail')">详情ㅤ〉</div>
		</div>
		<view v-if="weatherSwitch==true">
			<scroll-view scroll-y scroll-with-animation class="scrollList" :style="{'height':height}">
				<view class="cu-list grid" :class="['col-' + gridCol,gridBorder?'':'no-border']" style="background-color: rgba(0, 0, 0, 0);">
					<view class="cu-item">
						<!-- <div :class="[index%4==3?'border-right':'border-left']"> -->
						<div class="cu-listAll"  :style="{'width':width}">
							<div class="cuIcon" :style="{'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[6].cuIcon,'text-'+ cuIconList[0].color]"></view><a class="wenZhi"
								 :style="{'font-size':fontSize}">白气象</br>{{weatherProphetData_1[0].weather1}}</a>
							</div>

							<div class="cuIcon" :style="{'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[7].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								 class="wenZhi" :style="{'font-size':fontSize}">白气温</br>{{weatherProphetData_1[0].temperature1}}℃</a>
							</div>
							<div class="cuIcon" :style="{'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[8].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">白体感</br>{{weatherProphetData_1[0].realfeel1}}℃</a>
							</div>
							<div class="cuIcon4">
								<view class="icon iconfont" :class="['icon-' + cuIconList[9].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								 class="wenZhi" :style="{'font-size':fontSize}">白降水</br>{{weatherProphetData_1[0].precipitation1}}m/s</a>
							</div>
						</div>

						<div class="cu-listAllTwo"  :style="{'width':width,'margin-top':margintop}">
							<div class="cuIcon" :style="{'margin-top':margintop,'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[10].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">白风向</br>{{weatherProphetData_1[0].winddirection1}}</a>
							</div>

							<div class="cuIcon" :style="{'margin-top':margintop,'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[11].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">白风速</br>{{weatherProphetData_1[0].speed1}}km/h</a>
							</div>
							<div class="cuIcon" :style="{'margin-top':margintop,'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[12].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">白阵风速</br>{{weatherProphetData_1[0].gust1}}km/h</a>
							</div>
							<div class="cuIcon4" :style="{'margin-top':margintop}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[0].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">天气</br>{{weatherProphetData_1[0].weather}}</a>
							</div>

						</div>
						<div class="cu-listAllTThree"  :style="{'width':width,'margin-top':margintopThree}">
							<div class="cuIcon" :style="{'margin-top':margintopThree,'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[1].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">最高温度</br>{{weatherProphetData_1[0].maximumtem}}℃</a>
							</div>

							<div class="cuIcon" :style="{'margin-top':margintopThree,'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[2].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">最低温度</br>{{weatherProphetData_1[0].minimumtem}}℃</a>
							</div>
							<div class="cuIcon" :style="{'margin-top':margintopThree,'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[3].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">日出</br>{{weatherProphetData_1[0].sunrise}}</a>
							</div>
							<div class="cuIcon4" :style="{'margin-top':margintopThree}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[4].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">日落</br>{{weatherProphetData_1[0].sunset}}</a>
							</div>
						</div>
						<div class="cu-listAllTFour"  :style="{'width':width,'margin-top':margintopThree}">
							<div class="cuIcon" :style="{'margin-top':margintopThree,'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[5].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">持续时间</br>{{weatherProphetData_1[0].sunduration}}</a>
							</div>
							<div class="cuIcon2">
							</div>
							<div class="cuIcon2">
							</div>
							<div class="cuIcon2">
							</div>

						</div>
					</view>
				</view>
			</scroll-view>
		</view>
		<view v-if="weatherSwitch==false">
			<scroll-view scroll-y scroll-with-animation class="scrollList" :style="{'height':height}">
				<view class="cu-list grid" :class="['col-' + gridCol,gridBorder?'':'no-border']" style="background-color: rgba(0, 0, 0, 0);">
					<view class="cu-item">
						<!-- <div :class="[index%4==3?'border-right':'border-left']"> -->
						<div class="cu-listAll"  :style="{'width':width}">
							<div class="cuIcon" :style="{'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[6].cuIcon,'text-'+ cuIconList[0].color]"></view><a class="wenZhi"
								 :style="{'font-size':fontSize}">夜气象</br>{{weatherProphetData_1[0].weather2}}</a>
							</div>
			
							<div class="cuIcon" :style="{'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[7].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								 class="wenZhi" :style="{'font-size':fontSize}">夜气温</br>{{weatherProphetData_1[0].temperature2}}℃</a>
							</div>
							<div class="cuIcon" :style="{'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[8].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">夜体感</br>{{weatherProphetData_1[0].realfeel2}}℃</a>
							</div>
							<div class="cuIcon4">
								<view class="icon iconfont" :class="['icon-' + cuIconList[9].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								 class="wenZhi" :style="{'font-size':fontSize}">夜降水</br>{{weatherProphetData_1[0].precipitation2}}m/s</a>
							</div>
						</div>
			
						<div class="cu-listAllTwo"  :style="{'width':width,'margin-top':margintop}">
							<div class="cuIcon" :style="{'margin-top':margintop,'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[10].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">夜风向</br>{{weatherProphetData_1[0].winddirection2}}</a>
							</div>
			
							<div class="cuIcon" :style="{'margin-top':margintop,'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[11].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">夜风速</br>{{weatherProphetData_1[0].speed2}}km/h</a>
							</div>
							<div class="cuIcon" :style="{'margin-top':margintop,'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[12].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">夜阵风速</br>{{weatherProphetData_1[0].gust2}}km/h</a>
							</div>
							<div class="cuIcon4" :style="{'margin-top':margintop}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[0].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">天气</br>{{weatherProphetData_1[0].weather}}</a>
							</div>
			
						</div>
						<div class="cu-listAllTThree"  :style="{'width':width,'margin-top':margintopThree}">
							<div class="cuIcon" :style="{'margin-top':margintopThree,'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[1].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">最高温度</br>{{weatherProphetData_1[0].maximumtem}}℃</a>
							</div>
			
							<div class="cuIcon" :style="{'margin-top':margintopThree,'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[2].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">最低温度</br>{{weatherProphetData_1[0].minimumtem}}℃</a>
							</div>
							<div class="cuIcon" :style="{'margin-top':margintopThree,'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[3].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">日出</br>{{weatherProphetData_1[0].sunrise}}</a>
							</div>
							<div class="cuIcon4" :style="{'margin-top':margintopThree}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[4].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">日落</br>{{weatherProphetData_1[0].sunset}}</a>
							</div>
						</div>
						<div class="cu-listAllTFour"  :style="{'width':width,'margin-top':margintopThree}">
							<div class="cuIcon" :style="{'margin-top':margintopThree,'height':xianHeight}">
								<view class="icon iconfont" :class="['icon-' + cuIconList[5].cuIcon,'text-'+ cuIconList[0].color]"></view><a
								class="wenZhi" :style="{'font-size':fontSize}">持续时间</br>{{weatherProphetData_1[0].sunduration}}</a>
							</div>
							<div class="cuIcon2">
							</div>
							<div class="cuIcon2">
							</div>
							<div class="cuIcon2">
							</div>
			
						</div>
					</view>
				</view>
			</scroll-view>
		</view>

	</view>

</template>

<script>
	import utils from '../../components/tools/shoyu-date/utils.filter.js';
	// 直接使用办法
	import ThermometerCard from '../../components/thermometerCard/ThermometerCard.vue'
	/* 	import thermometerCard from '../../components/thermometerCard/ThermometerCard.vue' */
	export default {
		components: {
			"ThermometerCard": ThermometerCard
		},
		data: function() {
			return {
				utils: utils,
				margintop:'',
				margintopThree:'',
				messageTop:'',
				// 直接使用需要进行声明
				// 直接使用需要进行声明 End
				date: '2020/03/27 08:00:00',
				timestamp: "",
				address: '',
				option: '',
				cuIconList: [{
					cuIcon: 'weather',
					color: 'white',
					name: '天气',
				}, {
					cuIcon: 'maxTemperature',
					color: 'white',
					name: '最高温度',
				}, {
					cuIcon: 'minTemperature',
					color: 'white',
					name: '最低温度',
				}, {
					cuIcon: 'sunRise',
					color: 'white',
					name: '日出',
				}, {
					cuIcon: 'sunSet',
					color: 'white',
					name: '日落',
				}, {
					cuIcon: 'sunDuration',
					color: 'white',
					name: '持续时间',
				}, {
					cuIcon: 'dayWeather',
					color: 'white',
					name: '白气象',
				}, {
					cuIcon: 'dayTemperature',
					color: 'white',
					name: '白气温',
				}, {
					cuIcon: 'dayRealFeel',
					color: 'white',
					name: '白体感',
				}, {
					cuIcon: 'dayPrecipitation',
					color: 'white',
					name: '白降水',
				}, {
					cuIcon: 'dayWindDirection',
					color: 'white',
					name: '白风向',
				}, {
					cuIcon: 'dayWindSpeed',
					color: 'white',
					name: '白风速',
				}, {
					cuIcon: 'dayGust',
					color: 'white',
					name: '白阵风速',
				}, {
					cuIcon: 'nightWeather',
					color: 'white',
					name: '夜气象',
				}, {
					cuIcon: 'nightTemperature',
					color: 'white',
					name: '夜温度',
				}, {
					cuIcon: 'nightRealFeel',
					color: 'white',
					name: '夜体感',
				}, {
					cuIcon: 'nightPrecipitation',
					color: 'white',
					name: '夜降水',
				}, {
					cuIcon: 'nightWindDirection',
					color: 'white',
					name: '夜风向',
				}, {
					cuIcon: 'nightWindSpeed',
					color: 'white',
					name: '夜风速',
				}, {
					cuIcon: 'nightGust',
					color: 'white',
					name: '夜阵风速',
				}],
				modalName: null,
				gridCol: 4,
				gridBorder: false,
				weatherProphetDataAll_17Hour: [],
				weatherProphetData_17Hour: [{
					date:'',
					id:'',
					realfeel:'',
					region:'',
					speed:'',
					temperature:'',
					weather:'',
					winddirection:'',
					windpowerstationid:''
									}],
				weatherProphetDataAll_1: [],
				weatherProphetData_1: [{
					weather1:'',
					gust1:'',
					gust2:'',
					id:'',
					maximumtem:'',
					minimumtem:'',
					precipitation1:"",
					precipitation2:'',
					realfeel1:'',
					realfeel1:'',
					recodedata:'',
					region:'',
					speed1:'',
					speed2:'',
					sunduration:"",
					sunrise:'',
					sunset:'',
					temperature1:'',
					temperature2:'',
					weather:'',
					weather1:'',
					weather2:"",
					winddirection1:'',
					winddirection2:'',
					windpowerstationid:'',
				}],
				weatherSwitch: true,
				windPowerStationId: "MHS_FDC",
				windPowerStations: [],			
                width:'',
			    height:'',
				windowWidth:"",
				windowHeight:"",
				ziHeight:'',
				fontSize:'',
				xianHeight:'',
				marginleftBiao:'',
			}
		},
		created: function() {
			//this.pushWindPowerStationNameToSessionStorage("麻黄山");
			this.address = this.getWindPowerStationNameToSessionStorage();
			this.windPowerStationId=uni.getStorageSync('windPowerStationId');
			this.windowWidth=uni.getSystemInfoSync().windowWidth;
			this.windowHeight=uni.getSystemInfoSync().windowHeight;
			// this.getTodayWeatherData();
			this.$nextTick(function(){
				this.getWeatherData();
			});
			if(this.windowWidth>=768){
		    this.margintop="60px";
			this.margintopThree="80px";
			this.messageTop="10px";
			this.fontSize="18px";
			this.xianHeight="168px";
			this.marginleftBiao="50px";
			}else{
				this.margintop="10px";
				this.margintopThree="10px";
				this.fontSize="14px";
				this.xianHeight="92px";
				this.marginleftBiao="26px";
			}
			this.height = parseInt(uni.getSystemInfoSync().windowHeight - 500) + "px"
			this.width = parseInt(uni.getSystemInfoSync().windowWidth) + "px"
			//alert(this.address);
			
		},		
		onShow() {
			this.windPowerStationId=uni.getStorageSync('windPowerStationId');
			this.address = this.getWindPowerStationNameToSessionStorage();
			this.getWeatherData();
		},
		methods: {
			pushWindPowerStationNameToSessionStorage(windpowerstationName) {
				uni.setStorageSync('windpowerstationName', windpowerstationName);
				//sessionStorage.setItem('windpowerstationName', windpowerstationName);
				//alert("v"+ sessionStorage.getItem("windpowerstationName"));
				//this.common.goback('/pages/index/Index');
			},
			getWindPowerStationNameToSessionStorage() {
				uni.getStorageSync('windpowerstationName');
				return uni.getStorageSync('windpowerstationName');
			},
			getWeatherData: function() {
				//得到数据
				let _this = this;
				// 创建一个this.socketTask对象【发送、接收、关闭socket都由这个对象操作】
				// 按小时数据
				this.socketTaskHour = uni.connectSocket({
					// 【非常重要】必须确保你的服务器是成功的,如果是手机测试千万别使用ws://127.0.0.1:9099【特别容易犯的错误】
					url: "ws://49.4.78.143:8081/websocket/pageNumber_3/functionNumber_2",
					success(data) {
						console.log("websocket连接成功");
					},
				});
				// 今天数据
				this.socketTaskToday = uni.connectSocket({
					// 【非常重要】必须确保你的服务器是成功的,如果是手机测试千万别使用ws://127.0.0.1:9099【特别容易犯的错误】
					url: "ws://49.4.78.143:8081/websocket/pageNumber_2/functionNumber_1",
					success(data) {
						console.log("websocket连接成功");
					},
				});

				
				this.socketTaskToday.onOpen((res) => {
					console.log("WebSocket连接正常打开中...！");
					this.is_open_socket = true;

					// 注：只有连接正常打开中 ，才能正常收到消息
					this.socketTaskToday.onMessage((res) => {
						//console.log("收到服务器内容：" + res.data);
						_this.weatherProphetDataAll_1 = res.data;
						_this.weatherProphetDataAll_1 = JSON.parse(res.data);
						_this.weatherProphetData_1 = [];
						//判断风场id 40天
						for (let i = 0; i < _this.weatherProphetDataAll_1.length; i++) {
							if (_this.weatherProphetDataAll_1[i].windpowerstationid == _this.windPowerStationId) {
								_this.weatherProphetData_1.push(_this.weatherProphetDataAll_1[i]);
							}
						}
						console.log(_this.weatherProphetData_1)
						_this.$nextTick(function(){
							console.log(_this.$refs.thermometerCard);
							_this.$refs.thermometerCard.getHourWeatherData("90","360",_this.weatherProphetData_17Hour,_this.weatherProphetData_1);
						})
							
						
					});
				})
				// 消息的发送和接收必须在正常连接打开中,才能发送或接收【否则会失败】
				this.socketTaskHour.onOpen((res) => {
					console.log("WebSocket连接正常打开中...！");
					this.is_open_socket = true;
				
					// 注：只有连接正常打开中 ，才能正常收到消息
					this.socketTaskHour.onMessage((res) => {
						//console.log("收到服务器内容：" + res.data);
						_this.weatherProphetDataAll_17Hour = res.data;
						_this.weatherProphetDataAll_17Hour = JSON.parse(res.data);
						_this.weatherProphetData_17Hour = [];
						//判断风场id 40天
						for (let i1 = 0; i1 < _this.weatherProphetDataAll_17Hour.length; i1++) {
							if (_this.weatherProphetDataAll_17Hour[i1].windpowerstationid == _this.windPowerStationId) {
								_this.weatherProphetData_17Hour.push(_this.weatherProphetDataAll_17Hour[i1]);
							}
						}
						// console.log(_this.weatherProphetData_17Hour)
						_this.$nextTick(function(){
							console.log(_this.$refs.thermometerCard);
							_this.$refs.thermometerCard.getHourWeatherData("90","360",_this.weatherProphetData_17Hour,_this.weatherProphetData_1);
						})
							
						
					});
				})
				// 这里仅是事件监听【如果socket关闭了会执行】
				this.socketTaskHour.onClose(() => {
					console.log("已经被关闭了")
				})
				this.socketTaskToday.onClose(() => {
					console.log("已经被关闭了")
				})



			},
			weatherDayNightSwitch: function(flag) {
				if (flag == "day") {
					this.weatherSwitch = true;
				} else if (flag == "night") {
					this.weatherSwitch = false;
				}
			}


		},
		onLoad() {
			let that = this;
			// 时间转换为时间戳
			// 如果是时间戳直接传递，无需转换					
			//that.timestamp = new Date(this.date).getTime();
			//console.log(that.timestamp);
			this.address = this.getWindPowerStationNameToSessionStorage();					
			// this.getHourWeatherData();
		}
	}
</script>

<style>
	page {
		height: 100%;
		background: -webkit-gradient(linear, 0% 100%, 0% 0%, from(#2F698E), color-stop(0.15, #5C757C), to(#004C90));
		overflow-x: hidden;
		overflow-y: hidden;
	}

	.ThermometerCard {
		margin-top: -10px;
		height: 400px;
		width: 100%;
	}

	.border-left {
		border-style: solid;
		border-top-width: 0px;
		border-right-width: 1px;
		border-bottom-width: 0px;
		border-left-width: 0px;
		border-right-color: white;
	}

	.border-right {
		border-style: solid;
		border-top-width: 0px;
		border-right-width: 0px;
		border-bottom-width: 0px;
		border-left-width: 0px;
		border-right-color: #19B5BC;
	}

	.scrollList {
		height: 210px;
		// white-space: nowrap;
	}

	.content {

		/* display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center; */
	}

	.weatherDetails {
		width: 100%;
		height: 25rpx;
		float: left;

	}
.wenZhi{
	color: white;
}
	.weatherText {
		width: 40%;
		height: 10px;
		float: left;
		font-size: 14px;
		color: white;
		margin-left: 26px;
		margin-top: -15px;
	}

	.detailsText {
		width: 40%;
		height: 10px;
		float: right;
		font-size: 14px;
		color: white;
		margin-right: 5%;
		text-align: right;
		margin-top: -15px;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.icon {
		font-size: 50upx;
	}

	.cuIcon {
		border-right: 1px solid white;
		height: 92px;

	}

	.cu-listAll {
		width: 390px;
		height: 100px;
		display: -webkit-flex;
		display: flex;
		justify-content: space-around;
		margin-top: -20px;
	}

	.cu-listAllTwo {
		width: 390px;
		height: 100px;
		display: -webkit-flex;
		display: flex;
		justify-content: space-around;
		margin-top: 10px;
	}

	.cu-listAllTThree {
		width: 390px;
		height: 100px;
		display: -webkit-flex;
		display: flex;
		justify-content: space-around;
		margin-top: 10px;
	}

	.cu-listAllTFour {
		width: 390px;
		height: 100px;
		display: -webkit-flex;
		display: flex;
		justify-content: space-around;
		margin-top: 10px;
		// justify-content: space-around;
	}

	.cuIcon1 {
		margin-top: 20px;
	}
</style>