浏览代码

气象监视页面部署及方法调试

lizaixun 5 年之前
父节点
当前提交
fe8e8ac78d
共有 45 个文件被更改,包括 7110 次插入67 次删除
  1. 57 24
      common/common.js
  2. 1 1
      common/store.js
  3. 5 1
      components/drawer/forecastThreeLineDrawer.vue
  4. 173 0
      components/drawer/weatherThreeLineDrawer.vue
  5. 3662 0
      components/weatherProphethomepage/WeatherProphethomepage.vue
  6. 597 0
      components/weatherProphethomepage/weatherDetail/Detail.vue
  7. 537 0
      components/weatherProphethomepage/weathercomponents/thermometerCard/ThermometerCard.vue
  8. 884 0
      components/weatherProphethomepage/weathercomponents/weatherCalendarCardList40/weatherCalendarCard40/weatherCalendarCard40.vue
  9. 106 0
      components/weatherProphethomepage/weathercomponents/weatherCalendarCardList40/weatherCalendarCardList40.vue
  10. 496 0
      components/weatherProphethomepage/weathercomponents/weatherCalendarCardList8_15/weatherCalendarCard8_15/weatherCalendarCard8_15.vue
  11. 117 0
      components/weatherProphethomepage/weathercomponents/weatherCalendarCardList8_15/weatherCalendarCardList8_15.vue
  12. 431 0
      components/weatherProphethomepage/weathercomponents/weatherTemperatureWindSpeedCard_7/WeatherTemperatureWindSpeedCard_7.vue
  13. 25 1
      pages.json
  14. 19 40
      pages/forecast/Forecast.vue
  15. 二进制
      static/picture/thermometerCard/pic_tu_01.png
  16. 二进制
      static/picture/thermometerCard/pic_tu_02.png
  17. 二进制
      static/picture/thermometerCard/pic_tu_03.png
  18. 二进制
      static/picture/thermometerCard/thermometer/-10C.png
  19. 二进制
      static/picture/thermometerCard/thermometer/-15C.png
  20. 二进制
      static/picture/thermometerCard/thermometer/-20C.png
  21. 二进制
      static/picture/thermometerCard/thermometer/-25C.png
  22. 二进制
      static/picture/thermometerCard/thermometer/-30C.png
  23. 二进制
      static/picture/thermometerCard/thermometer/-35C.png
  24. 二进制
      static/picture/thermometerCard/thermometer/-40C.png
  25. 二进制
      static/picture/thermometerCard/thermometer/-45C.png
  26. 二进制
      static/picture/thermometerCard/thermometer/-50C.png
  27. 二进制
      static/picture/thermometerCard/thermometer/-5C.png
  28. 二进制
      static/picture/thermometerCard/thermometer/0C.png
  29. 二进制
      static/picture/thermometerCard/thermometer/10C.png
  30. 二进制
      static/picture/thermometerCard/thermometer/15C.png
  31. 二进制
      static/picture/thermometerCard/thermometer/20C.png
  32. 二进制
      static/picture/thermometerCard/thermometer/25C.png
  33. 二进制
      static/picture/thermometerCard/thermometer/30C.png
  34. 二进制
      static/picture/thermometerCard/thermometer/35C.png
  35. 二进制
      static/picture/thermometerCard/thermometer/40C.png
  36. 二进制
      static/picture/thermometerCard/thermometer/45C.png
  37. 二进制
      static/picture/thermometerCard/thermometer/50C.png
  38. 二进制
      static/picture/thermometerCard/thermometer/5C.png
  39. 二进制
      static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png
  40. 二进制
      static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png
  41. 二进制
      static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png
  42. 二进制
      static/picture/weatherTemperatureWindSpeedCard_7/blue22.png
  43. 二进制
      static/picture/weatherTemperatureWindSpeedCard_7/iconall.png
  44. 二进制
      static/picture/weatherTemperatureWindSpeedCard_7/white30.png
  45. 二进制
      static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png

+ 57 - 24
common/common.js

@@ -12,31 +12,64 @@ class Common{
 	
 	goback(url){
 	 var page = getCurrentPages();
+	 console.log(page);
+	 console.log(url);
 	 let windpowerstationName =  uni.getStorageSync('windpowerstationName');
-	 page[0].$vm.address = windpowerstationName;
-	 	 if(windpowerstationName=="宁夏新能源公司"){
-	 	 	 	page[0].$vm.FDC="0";
-	 	 	 }
-	 	 	 if(windpowerstationName=="麻黄山风电场"){
-	 	 	 	page[0].$vm.FDC="MHS_FDC";
-	 	 	 }
-	 	 	 if(windpowerstationName=="牛首山风电场"){
-	 	 	 	page[0].$vm.FDC="NSS_FDC";
-	 	 	 }
-	 	 	 if(windpowerstationName=="石板泉风电场"){
-	 	 	 	page[0].$vm.FDC="SBQ_FDC";
-	 	 	 }
-	 	 	 if(windpowerstationName=="青山风电场"){
-	 	 	 	page[0].$vm.FDC="QS_FDC";
-	 	 	 }
-	 	 	 if(windpowerstationName=="香山风电场"){
-	 	 	 	page[0].$vm.FDC="XS_FDC";
-	 	 	 }
-	 		 page[0].target_comprehensive_indicators();
-			 page[0].target_windSpeed_power();
-			 page[0].index_windturbine_status();
-			 page[0].index_electricQuantity();
-			 page[0].index_target_basic_indicators();
+	 page[page.length-1].$vm.address = windpowerstationName;
+			// if(windpowerstationName=="宁夏新能源公司"){
+			// 	if(page[page.length-1].route=="components/weatherProphethomepage/WeatherProphethomepage"){
+			// 		page[page.length-1].$vm.FDC="MHS_FDC";
+			// 	}else{
+			// 		page[page.length-1].$vm.FDC="0";
+			// 	}
+	 	//  	 }
+	 	//  	 if(windpowerstationName=="麻黄山风电场"){
+	 	//  	 	page[page.length-1].$vm.FDC="MHS_FDC";
+	 	//  	 }
+	 	//  	 if(windpowerstationName=="牛首山风电场"){
+	 	//  	 	page[page.length-1].$vm.FDC="NSS_FDC";
+	 	//  	 }
+	 	//  	 if(windpowerstationName=="石板泉风电场"){
+	 	//  	 	page[page.length-1].$vm.FDC="SBQ_FDC";
+	 	//  	 }
+	 	//  	 if(windpowerstationName=="青山风电场"){
+	 	//  	 	page[page.length-1].$vm.FDC="QS_FDC";
+	 	//  	 }
+	 	//  	 if(windpowerstationName=="香山风电场"){
+	 	//  	 	page[page.length-1].$vm.FDC="XS_FDC";
+	 	//  	 }
+			 //首页
+			 if(page[page.length-1].route=="pages/index/Index"){
+				 page[page.length-1].target_comprehensive_indicators();
+				 page[page.length-1].target_windSpeed_power();
+				 page[page.length-1].index_windturbine_status();
+				 page[page.length-1].index_electricQuantity();
+				 page[page.length-1].index_target_basic_indicators();
+			 }
+			 if(page[page.length-1].route=="components/weatherProphethomepage/WeatherProphethomepage"){
+				 page[page.length-1].getWeatherDataToday();
+				 page[page.length-1].getWeatherData7();
+				 page[page.length-1].getWeatherData();
+				 page[page.length-1].getWeatherData40();
+				 if(windpowerstationName=="宁夏新能源公司"){
+				 	page[page.length-1].$vm.windStationName="麻黄山";
+				  }
+				  if(windpowerstationName=="麻黄山风电场"){
+				  	page[page.length-1].$vm.windStationName="麻黄山";
+				  }
+				  if(windpowerstationName=="牛首山风电场"){
+				  	page[page.length-1].$vm.windStationName="牛首山";
+				  }
+				  if(windpowerstationName=="石板泉风电场"){
+				  	page[page.length-1].$vm.windStationName="石板泉";
+				  }
+				  if(windpowerstationName=="青山风电场"){
+				  	page[page.length-1].$vm.windStationName="青山";
+				  }
+				  if(windpowerstationName=="香山风电场"){
+				  	page[page.length-1].$vm.windStationName="香山";
+				  }
+			 }
 	
   //    uni.showModal({
 		// 		title: '提示',

+ 1 - 1
common/store.js

@@ -5,7 +5,7 @@ Vue.use(Vuex)
 
 const store = new Vuex.Store({
     state: {
-		wholeSituationBackStageIp:'127.20.10.9',
+		wholeSituationBackStageIp:'192.168.1.103',
 		wholeSituationBackStagePort:'8082',
 		windpowerstationNameToId:{
            "宁夏新能源公司":"0","麻黄山风电场":"MHS_FDC","牛首山风电场":"NSS_FDC","青山风电场":"SBQ_FDC","石板泉风电场":"QS_FDC","香山风电场":"QS_FDC"

+ 5 - 1
components/drawer/forecastThreeLineDrawer.vue

@@ -10,7 +10,7 @@
 					</view>
 					
 					<view v-for="(item,index) in drawerList" :class="[changeGary==index?'statusMonitoring':'item']" :key="index" @click="clickChangeColor(index)">
-						<div v-if="(index==0)" @tap="goToIndex()">
+						<div v-if="(index==0)" @click="startSwitch()">
 							{{item.name}}
 							</div>
 					<div v-if="(index==1)" @tap="common.navTo('/components/monitor/StatusMonitor')">
@@ -64,6 +64,7 @@
 				width: 250,
 				inconList: [],
 				changeGary: -1,
+				toggleSwitch:false,
 			}
 		},
 		methods: {
@@ -83,6 +84,9 @@
 				uni.switchTab({
 				     url: '/pages/index/Index'
 				    });
+			},
+			startSwitch:function(){
+				this.$parent.$root.toggleSwitch = true;
 			}
 		}
 	}

+ 173 - 0
components/drawer/weatherThreeLineDrawer.vue

@@ -0,0 +1,173 @@
+<template>
+	<view class="container">
+		<!-- 抽屜 -->
+		<uni-drawer :visible="drawerIsShow" :width="width" @close="closeDrawer" style="z-index: 99999;">
+			<view style="padding:0rpx; background-color:#1A1A1A;">
+				<view class="picture">
+					<view class="sisGroup">监视功能分组
+					<view class="iconImgage">
+					</view>
+					</view>
+					
+					<view v-for="(item,index) in drawerList" :class="[changeGary==index?'statusMonitoring':'item']" :key="index" @click="clickChangeColor(index)">
+						<div v-if="(index==0)" @click="switchWeather()">
+							{{item.name}}
+							</div>
+					<div v-if="(index==1)" @tap="common.navTo('/components/monitor/StatusMonitor')">
+						{{item.name}}
+						</div>
+						<div v-if="(index==2)" @tap="common.navTo('/components/monitor/MatrixMonitor')">
+							{{item.name}}
+							</div>
+							<div v-if="(index==3)" @tap="common.navTo('/components/monitor/WindMonitor')">
+								{{item.name}}
+								</div>
+								<div v-if="(index==4)" @tap="common.navTo('/components/monitor/PersonalMonitor')">
+									{{item.name}}
+									</div>
+					</view>
+
+				</view>
+				<view class="cu-bar tabbar bg-black">
+					<view class="action">
+						<view class="icon cuIcon-repair text-black">
+						</view>
+						<view class="text-black">设置</view>
+					</view>
+					<view class="action" style="margin-left: 30px;">
+						<view class="icon cuIcon-command text-black">
+						</view>
+						<view class="text-black">修改密码</view>
+					</view>
+				</view>
+			</view>
+		</uni-drawer>
+	</view>
+</template>
+
+<script>
+	import uniDrawer from "@/uni-drawer/uni-drawer.vue"
+	import uniList from '@/uni-list/uni-list.vue'
+	import uniListItem from '@/uni-list-item/uni-list-item.vue'
+	import uniIcons from '@/uni-icons/uni-icons.vue'
+	export default {
+		components: {
+			uniDrawer,
+			uniList,
+			uniListItem,
+			uniIcons
+		},
+		data: function() {
+			return {
+				drawerIsShow: false,
+				drawerList: [],
+				width: 250,
+				inconList: [],
+				changeGary: -1,
+			}
+		},
+		methods: {
+			openDrawer: function(width, drawerList, inconList) {
+				this.drawerIsShow = true;
+				this.drawerList = drawerList;
+				this.width = width;
+				this.inconList = inconList;
+			},
+			closeDrawer: function() {
+				this.drawerIsShow = false;
+			},
+			clickChangeColor: function(index) {
+				this.changeGary = index;
+			},
+			goToIndex:function(){
+				uni.switchTab({
+				     url: '/pages/forecast/Forecast'
+				    });
+			},
+			switchWeather:function(){
+				this.$parent.$root.toggleSwitch = false
+			}
+		}
+	}
+</script>
+
+<style>
+	.container{
+		
+	}
+	.sisGroup {
+		width: 90%;
+		height: 65px;
+		color: silver;
+		font-size: 13px;
+		padding-top: 40px;
+		margin-left: 5%;
+		font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", STHeiti, "Microsoft Yahei", Tahoma, Simsun, sans-serif;
+		
+	}
+
+	.statusMonitoring {
+		background-color: #393939;
+		width: 90%;
+		margin-left: 5%;
+		height: 40px;
+		margin-top: 10px;
+		/* text-align: center; */
+		color: silver;
+		font-size: 14px;
+		padding-top: 10px;
+		padding-left: 10px;
+		font-family: Helvetica Neue, Helvetica, sans-serif;
+		
+		}
+
+	.picture {
+		width: 300px;
+		height: 700px;
+		background-color: #1A1A1A;
+		
+	}
+
+	.cu-bar {
+		position: fixed;
+		top: calc(100% - 50px);
+		width: 100%;
+		background-color: #1A1A1A;
+	}
+
+	.icon {
+		float: left;
+	}
+
+	.text-black {
+		float: left;
+		line-height: 28px;
+		font-size: 15px;
+		background-color: #1A1A1A;
+		color: silver;
+		
+	}
+	.iconImgage{
+		width: 29px;
+		height: 35px;
+		background-color: red;
+		margin-left: 82px;
+		margin-top: -25px;
+		background-image: url(../../static/picture/i.jpg);
+	}
+	.item {
+		width: 90%;
+		height: 40px;
+		margin-top: 10px;
+		margin-left: 5%;
+		/* float: right; */
+		/* margin-right: 10px; */
+		background-color: #272727;
+		/* text-align: center; */
+		color: silver;
+		font-size: 14px;
+		padding-top: 10px;
+		padding-left: 10px;
+		font-family: Helvetica Neue, Helvetica, sans-serif;
+	}
+</style>

文件差异内容过多而无法显示
+ 3662 - 0
components/weatherProphethomepage/WeatherProphethomepage.vue


+ 597 - 0
components/weatherProphethomepage/weatherDetail/Detail.vue

@@ -0,0 +1,597 @@
+<template>
+	<view class="content">
+		<!-- <image class="logo" src="/static/logo.png"></image> -->
+		<!--导航栏-->
+		<view>
+			<cu-custom bgColor="bg-blacks" :isBack="true">
+				<block slot="backText">
+					<view style="height: 80rpx;line-height: 80rpx;">返回</view>
+				</block>
+				<block slot="content">{{address}}</block>
+			</cu-custom>
+		</view>
+		
+		<!-- 卡片 -->
+		<view class="cu-card case" :class="isCard?'no-card':''">
+			<view class="cardContenter">	
+				<view class="timeAndTitle">
+					<view class="time" :style="{'font-size':timeFontSize}">
+						{{startDate}}~{{endDate}}
+					</view>
+					<view class="title" :style="{'font-size':titleFontSize}">
+						温度/体感
+					</view>				
+				</view>
+				<!-- uCharts柱状图 -->
+				<scroll-view scroll-x="true" class="scrollUcharts">
+					<view class="qiun-charts-column" >
+						<canvas canvas-id="canvasColumn" id="canvasColumn" class="charts-column"></canvas>
+					</view>
+				</scroll-view>									
+			</view>
+		</view>
+		
+		<!-- 卡片 -->
+		<view class="cu-card case" :class="isCard?'no-card':''">
+			<view class="cardContenter">	
+				<view class="timeAndTitle">
+					<view class="time" :style="{'font-size':timeFontSize}">
+						{{startDate}}~{{endDate}}
+					</view>
+					<view class="title" :style="{'font-size':titleFontSize}">
+						风速/风向
+					</view>
+				</view>					
+				<!-- uCharts折线图 -->
+				<scroll-view scroll-x="true" class="scrollUcharts">
+					<view class="hours">
+						<view class="hour" :style="{'font-size':hourFontSize}" v-for="(item,index) in hours" :key="index">
+							{{item}}时
+						</view>
+					</view>
+					<view class="qiun-charts-lineA">
+						<canvas canvas-id="canvasLineA" id="canvasLineA" class="charts-lineA"></canvas>
+					</view>
+				</scroll-view>									
+			</view>
+		</view>
+		
+	 </view>
+</template>
+
+<script>
+	import uCharts from '../../tools/u-charts/u-charts.js';
+	export default {
+		data() {
+			return {
+				address: '',
+				option: '',
+				isCard: false,
+				cWidthLineA:'',
+				cHeightLineA:'',
+				pixelRatioLineA:1,
+				cWidthColumn:'',
+				cHeightColumn:'',
+				pixelRatioColumn:1,
+				weatherProphetData_17Hour:[
+					{
+						'data': '2020/02/25 00:00:00',
+						'temperature': '15',
+						'realfeel': '8',
+						'winddirection': '东北',
+						'speed': '3',
+					},
+					{
+						'data': '2020/02/25 01:00:00',
+						'temperature': '15',
+						'realfeel': '10',
+						'winddirection': '东北',
+						'speed': '4',
+					},
+					{
+						'data': '2020/02/25 02:00:00',
+						'temperature': '15',
+						'realfeel': '15',
+						'winddirection': '东北',
+						'speed': '5',
+					},
+					{
+						'data': '2020/02/25 03:00:00',
+						'temperature': '15',
+						'realfeel': '9',
+						'winddirection': '东北',
+						'speed': '4',
+					},
+					{
+						'data': '2020/02/25 04:00:00',
+						'temperature': '15',
+						'realfeel': '15',
+						'winddirection': '东北',
+						'speed': '3',
+					},
+					{
+						'data': '2020/02/25 05:00:00',
+						'temperature': '15',
+						'realfeel': '15',
+						'winddirection': '东北',
+						'speed': '4',
+					},
+					{
+						'data': '2020/02/25 06:00:00',
+						'temperature': '15',
+						'realfeel': '13',
+						'winddirection': '东北',
+						'speed': '5',
+					},
+					{
+						'data': '2020/02/25 07:00:00',
+						'temperature': '15',
+						'realfeel': '15',
+						'winddirection': '东北',
+						'speed': '4',
+					},
+					{
+						'data': '2020/02/25 08:00:00',
+						'temperature': '15',
+						'realfeel': '15',
+						'winddirection': '东北',
+						'speed': '3',
+					},
+					{
+						'data': '2020/02/25 09:00:00',
+						'temperature': '15',
+						'realfeel': '15',
+						'winddirection': '东北',
+						'speed': '4',
+					},
+					{
+						'data': '2020/02/25 10:00:00',
+						'temperature': '15',
+						'realfeel': '15',
+						'winddirection': '东北',
+						'speed': '5',
+					},
+					{
+						'data': '2020/02/25 11:00:00',
+						'temperature': '15',
+						'realfeel': '15',
+						'winddirection': '东北',
+						'speed': '4',
+					},
+					{
+						'data': '2020/02/25 12:00:00',
+						'temperature': '15',
+						'realfeel': '15',
+						'winddirection': '东北',
+						'speed': '3',
+					},
+					{
+						'data': '2020/02/25 13:00:00',
+						'temperature': '15',
+						'realfeel': '15',
+						'winddirection': '东北',
+						'speed': '4',
+					},
+					{
+						'data': '2020/02/25 14:00:00',
+						'temperature': '15',
+						'realfeel': '15',
+						'winddirection': '东北',
+						'speed': '5',
+					},
+					{
+						'data': '2020/02/25 15:00:00',
+						'temperature': '15',
+						'realfeel': '15',
+						'winddirection': '西南偏西',
+						'speed': '4',
+					},
+					{
+						'data': '2020/02/25 16:00:00',
+						'temperature': '15',
+						'realfeel': '15',
+						'winddirection': '西南偏西',
+						'speed': '3',
+					}
+				],								
+				startDate:"",
+				endDate:"",
+				hours:[],
+				weatherProphetDataAll_17Hour:[],
+				windPowerStationId:"MHS_FDC",
+				windowWidth:"",
+				windowHeight:"",
+				timeFontSize:"",
+				titleFontSize:"",
+				hourFontSize:"",
+				xAxisFontSize:"",
+				seriesTextSize:""
+			};
+		},
+		created: function() {
+			//this.pushWindPowerStationNameToSessionStorage("麻黄山");
+			this.address = this.getWindPowerStationNameToSessionStorage();
+			this.windPowerStationId=uni.getStorageSync('windPowerStationId');
+			this.getWeatherData();
+			this.windowWidth=uni.getSystemInfoSync().windowWidth;
+			this.windowHeight=uni.getSystemInfoSync().windowHeight;
+			if(this.windowWidth>=768){
+				this.timeFontSize="22px";
+				this.titleFontSize="22px";
+				this.hourFontSize="22px";
+				this.xAxisFontSize=18;
+				this.seriesTextSize=18;
+			}else{
+				this.timeFontSize="15px";
+				this.titleFontSize="15px";
+				this.hourFontSize="15px";
+				this.xAxisFontSize=12;
+				this.seriesTextSize=12;
+			}
+		},
+		onShow() {
+			this.address = this.getWindPowerStationNameToSessionStorage();
+			this.windPowerStationId=uni.getStorageSync('windPowerStationId');
+			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.socketTask = 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.socketTask.onOpen((res) => {
+					console.log("WebSocket连接正常打开中...!");
+					this.is_open_socket = true;
+				
+					// 注:只有连接正常打开中 ,才能正常收到消息
+					this.socketTask.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 i = 0; i < _this.weatherProphetDataAll_17Hour.length; i++) {
+							if(_this.weatherProphetDataAll_17Hour[i].windpowerstationid == _this.windPowerStationId) {								
+								_this.weatherProphetData_17Hour.push(_this.weatherProphetDataAll_17Hour[i]);
+							}
+						}
+						//console.log(_this.weatherProphetData_17Hour);
+						let startMonth = new Date(_this.weatherProphetData_17Hour[0].date).getMonth() + 1;
+						let startDay = new Date(_this.weatherProphetData_17Hour[0].date).getDate() ;
+						let startHour = new Date(_this.weatherProphetData_17Hour[0].date).getHours() ;
+						_this.startDate = startMonth + "月" + startDay+"日" + startHour+"时";
+						let endMonth = new Date(_this.weatherProphetData_17Hour[_this.weatherProphetData_17Hour.length-1].date).getMonth() + 1;
+						let endDay = new Date(_this.weatherProphetData_17Hour[_this.weatherProphetData_17Hour.length-1].date).getDate() ;
+						let endHour = new Date(_this.weatherProphetData_17Hour[_this.weatherProphetData_17Hour.length-1].date).getHours() ;
+						_this.endDate = endMonth + "月" + endDay+"日" + endHour+"时";
+						_this.hours=[];
+						for(let i=0;i<_this.weatherProphetData_17Hour.length;i++){
+							_this.hours.push(new Date(_this.weatherProphetData_17Hour[i].date).getHours());
+						}
+						_this.getServerData();
+					});
+				})
+				// 这里仅是事件监听【如果socket关闭了会执行】
+				this.socketTask.onClose(() => {
+					console.log("已经被关闭了")
+				})
+				
+				
+				
+				// let _this = this;
+				// if(typeof(WebSocket) == "undefined") {
+				// 	console.log("您的浏览器不支持WebSocket");
+				// } else {
+				// 	console.log("您的浏览器支持WebSocket");
+				// 	//实现化WebSocket对象,指定要连接的服务器地址与端口  建立连接
+				// 	this.socket = new WebSocket("ws://49.4.78.143:8081/websocket/pageNumber_3/functionNumber_2");
+				// 	this.openSocket();
+				// 	//获得消息事件
+				// 	this.socket.onmessage = function onMessage(message) {
+				// 		_this.weatherProphetDataAll_17Hour = eval(message.data);
+				// 		_this.weatherProphetData_17Hour = [];
+				// 		//判断风场id
+				// 		for(let i = 0; i < _this.weatherProphetDataAll_17Hour.length; i++) {
+				// 			if(_this.weatherProphetDataAll_17Hour[i].windpowerstationid == _this.windPowerStationId) {
+				// 				_this.weatherProphetData_17Hour.push(_this.weatherProphetDataAll_17Hour[i]);
+				// 			}
+				// 		}
+				// 		console.log(_this.weatherProphetData_17Hour);
+				// 		let startMonth = new Date(_this.weatherProphetData_17Hour[0].date).getMonth() + 1;
+				// 		let startDay = new Date(_this.weatherProphetData_17Hour[0].date).getDate() ;
+				// 		let startHour = new Date(_this.weatherProphetData_17Hour[0].date).getHours() ;
+				// 		_this.startDate = startMonth + "月" + startDay+"日" + startHour+"时";
+				// 		let endMonth = new Date(_this.weatherProphetData_17Hour[_this.weatherProphetData_17Hour.length-1].date).getMonth() + 1;
+				// 		let endDay = new Date(_this.weatherProphetData_17Hour[_this.weatherProphetData_17Hour.length-1].date).getDate() ;
+				// 		let endHour = new Date(_this.weatherProphetData_17Hour[_this.weatherProphetData_17Hour.length-1].date).getHours() ;
+				// 		_this.endDate = endMonth + "月" + endDay+"日" + endHour+"时";
+				// 		_this.hours=[];
+				// 		for(let i=0;i<_this.weatherProphetData_17Hour.length;i++){
+				// 			_this.hours.push(new Date(_this.weatherProphetData_17Hour[i].date).getHours());
+				// 		}
+				// 		_this.getServerData();
+				// 	}
+				// }	
+			},
+			getServerData(){			
+				//柱状图
+				let Column={
+					 "categories": ["2012", "2013", "2014", "2015", "2016", "2017"],
+					  "series": [{
+						"name": "成交量1",
+						"data": [15, {"value": 20,"color": "#f04864"}, 45, 37, 43, 34],
+						"color": '#f04864',
+						"textColor":"#FFFFFF",
+						"textSize":this.seriesTextSize,
+						format:(val)=>{return val+'℃ㅤ'}
+					  }, {
+						"name": "成交量2",
+						"data": [30, {"value": 40,"color": "#facc14"}, 25, 14, 34, 18],
+						"color": '#facc14',
+						"textColor":"#FFFFFF",
+						"textSize":this.seriesTextSize,
+						format:(val)=>{return 'ㅤ'+val+'℃'}
+					  }]
+				};
+				Column.categories=[];
+				Column.series[0].data=[];
+				Column.series[1].data=[];
+				for(let i=0;i<this.weatherProphetData_17Hour.length;i++){		
+					let xAxisHours = new Date(this.weatherProphetData_17Hour[i].date).getHours();					
+					Column.categories.push(xAxisHours+"时");
+					Column.series[0].data.push(this.weatherProphetData_17Hour[i].temperature);
+					Column.series[1].data.push(this.weatherProphetData_17Hour[i].realfeel);
+				}	
+				this.showColumn("canvasColumn",Column);
+				
+				//折线图
+				let LineA={
+					categories: ['2012', '2013', '2014', '2015', '2016', '2017'],
+					series: [{
+						name: '风速',
+						data: [35, 20, 25, 37, 4, 20],
+						color: '#FFFFFF',
+						textColor:"#FFFFFF",
+						textSize:this.seriesTextSize,
+						format:(val)=>{return val+'km/h'}
+					}]
+				};
+				LineA.categories=[];
+				LineA.series[0].data=[];									
+				for(let i=0;i<this.weatherProphetData_17Hour.length;i++){		
+					LineA.categories.push(this.weatherProphetData_17Hour[i].winddirection );
+					LineA.series[0].data.push(this.weatherProphetData_17Hour[i].speed);
+				}										
+				this.showLineA("canvasLineA",LineA);	
+				
+			},
+			showColumn(canvasId,chartData){
+				var _self = this;
+				var canvaColumn=new uCharts({
+					$this:_self,
+					canvasId: canvasId,
+					type: 'column',
+					legend:{show:false},
+					fontSize:11,
+					background:'#FFFFFF',
+					pixelRatio:_self.pixelRatioColumn,
+					animation: true,
+					categories: chartData.categories,
+					series: chartData.series,
+					xAxis: {
+						disableGrid:true,
+						fontColor:"#FFFFFF",
+						fontSize:_self.xAxisFontSize,
+					},
+					yAxis: {
+						disabled:true,
+						disableGrid:true,
+						min:-40,
+						max:50,
+					},
+					dataLabel: true,
+					width: _self.cWidthColumn*_self.pixelRatioColumn,
+					height: _self.cHeightColumn*_self.pixelRatioColumn,
+					padding:[0,10,15,10],//画布填充边距,顺序为上右下左,同css,但必须4位
+					extra: {
+						column: {
+							type:'group',
+							width: '10'					
+						}
+					  }
+				});			
+							
+			},
+			showLineA(canvasId,chartData){
+				var _self = this;
+				var canvaLineA=new uCharts({
+					$this:_self,
+					canvasId: canvasId,
+					type: 'line',
+					fontSize:11,
+					legend:{show:false},//图例
+					dataLabel:true,//数据点标签
+					dataPointShape:true,
+					background:'#FFFFFF',
+					pixelRatio:_self.pixelRatioLineA,
+					categories: chartData.categories,
+					series: chartData.series,
+					animation: true,
+					xAxis: {
+						type:'grid',
+						gridColor:'#CCCCCC',
+						gridType:'dash',
+						dashLength:8,
+						disableGrid:true,//网格线
+						axisLine:true,//x轴轴线
+						fontColor:"#FFFFFF",
+						fontSize:_self.xAxisFontSize
+					},
+					yAxis: {	
+						data:{
+							disabled:false//y轴轴线
+						},			
+						disableGrid:true,//网格线
+						gridType:'dash',
+						gridColor:'#CCCCCC',
+						dashLength:8,
+						splitNumber:5,
+						min:-40,
+						max:40,
+						format:(val)=>{return val.toFixed(0)+'元'}
+					},
+					width: _self.cWidthLineA*_self.pixelRatioLineA,
+					height: _self.cHeightLineA*_self.pixelRatioLineA,
+					padding:[0,0,15,-25],//画布填充边距,顺序为上右下左,同css,但必须4位
+					extra: {
+						line:{
+							type: 'curve'//曲线
+						}
+					}
+				});
+			},
+			closeSocket: function() {
+				this.socket.onclose;
+			},
+			openSocket: function() {
+				this.socket.onOpen;
+			}
+		},
+		onLoad(option) {		
+			this.cWidthColumn=uni.upx2px(840);
+			this.cHeightColumn=uni.upx2px(350);
+			this.cWidthLineA=uni.upx2px(840);
+			this.cHeightLineA=uni.upx2px(300);
+			//this.getServerData();
+			this.address = this.getWindPowerStationNameToSessionStorage();;
+		
+		}
+	}
+</script>
+
+<style>
+page {
+		background-color: #1f1f1f;
+		font-family: '方正兰亭细黑_GBK';
+		overflow-x: hidden;
+	}	
+.cu-card{
+	width: 90%;
+	height: 450upx;
+	margin: 15px auto;
+}
+.cardContenter{	
+	border-radius: 20px;
+	/* margin: 20px auto; */
+	width: 100%;
+	height: 450upx;
+	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#024F93), color-stop(1.5, #cccccc), to(#437193));
+	background: rgba(0, 0, 0, 0.1);
+}
+.timeAndTitle{
+	width: 90%;
+	margin-left: 20px;
+	height: 100upx;
+	font-family: "microsoft yahei";
+	font-size: 15px;
+	color: white;
+}
+.time{
+	float: left;
+	height: 100upx;
+	line-height: 100upx;
+}
+.title{
+	float: right;
+	text-align: right;
+	height: 100upx;
+	line-height: 100upx;
+}
+.hours{
+	width: 800upx;
+	height: 50upx;
+	margin-left: 27px;
+	color: white;
+}
+.hour{
+	width: 50upx;
+	float: left;
+	margin-right: 32px;
+}
+.scrollUcharts{
+	white-space: nowrap;
+}
+
+.qiun-charts-lineA {
+		width: 840upx;
+		height: 300upx;
+	}
+	
+	.charts-lineA {
+		width: 840upx;
+		height: 300upx;
+	}
+.qiun-padding{
+	padding:2%;
+	width:96%;
+}
+.qiun-wrap{
+	display:flex; 
+	flex-wrap:wrap;
+}
+.qiun-rows{
+	display:flex; 
+	flex-direction:row !important;
+}
+.qiun-columns{
+	display:flex; 
+	flex-direction:column !important;
+}
+.qiun-common-mt{
+	margin-top:10upx;
+}
+.qiun-bg-white{
+	background:#FFFFFF;
+}
+.qiun-title-bar{
+	width:96%; 
+	padding:10upx 2%; 
+	flex-wrap:nowrap;
+}
+.qiun-title-dot-light{
+	border-left: 10upx solid #0ea391; 
+	padding-left: 10upx; 
+	font-size: 32upx;
+	color: #000000
+}
+.qiun-charts-column{
+	width: 840upx; 
+	height:350upx;
+	/* background-color: #FFFFFF; */
+}
+.charts-column{
+	width: 840upx; 
+	height:350upx;
+	/* background-color: #FFFFFF; */
+}	
+	
+	
+</style>

+ 537 - 0
components/weatherProphethomepage/weathercomponents/thermometerCard/ThermometerCard.vue

@@ -0,0 +1,537 @@
+<template>
+	<div>
+		<div class="thermometerContainer" :style="{'width':width,'height':height}">
+			<!-- <div class="container" :style="{'width':width,'height':height}"> -->
+				<div class="time">
+					{{nowTime}} 实况
+				</div>
+				<div class="thermometerAndTemperature">
+					<div class="temperature">
+						{{weatherProphetData_17Hour[0].temperature}}<span>℃</span>
+					</div>
+					<div :class="[thermometerClassName,totalClassName]" style="transform: scale(0.80);margin-left: 28%;margin-top: -14%;">
+					</div>
+				</div>
+				<div class="realFeelWindDirectionSpeed">
+					<div class="realFeel">
+						<div class="realFeelIcon"></div>&nbsp;体感温度:{{weatherProphetData_17Hour[0].realfeel}}℃
+					</div>
+					<div class="windDirection">
+						<div class="windDirectionIcon"></div>&nbsp;风向:{{weatherProphetData_17Hour[0].winddirection}}风
+					</div>
+					<div class="speed">
+						<div class="speedIcon"></div>&nbsp;风速:{{weatherProphetData_17Hour[0].speed}}km/h
+					</div>
+				</div>
+				<div class="weatherDayTemperatureSunrise" v-show="weatherSwitch==true">
+					<div class="dayTemperature">
+						<div class="dayTemperatureIcon"></div>&nbsp;温度:{{weatherProphetData_1[0].temperature1}}℃
+					</div>
+					<div class="daySunrise">
+						<div class="daySunriseIcon"></div>&nbsp;日出:{{weatherProphetData_1[0].sunrise}}
+					</div>
+					<div class="weatherDayAndNightButton">
+						<div :class="[weatherSwitch==true?'dayButtonWhite':'dayButtonBlack']" @click="weatherDaySwitch()">白天</div>
+						<div :class="[weatherSwitch==false?'nightButtonWhite':'nightButtonBlack']" @click="weatherNightSwitch()">夜间</div>
+					</div>
+				</div>
+				<div class="weatherNightTemperatureSunrise"  v-show="weatherSwitch==false">
+					<div class="nightTemperature">
+						<div class="nightTemperatureIcon"></div>&nbsp;温度:{{weatherProphetData_1[0].temperature2}}℃
+					</div>
+					<div class="nightSunrise">
+						<div class="nightSunriseIcon"></div>&nbsp;日落:{{weatherProphetData_1[0].sunset}}
+					</div>
+					<div class="weatherDayAndNightButton">
+						<div :class="[weatherSwitch==true?'dayButtonWhite':'dayButtonBlack']" @click="weatherDaySwitch()">白天</div>
+						<div :class="[weatherSwitch==false?'nightButtonWhite':'nightButtonBlack']" @click="weatherNightSwitch()">夜间</div>
+					</div>
+				</div>
+				
+			<!-- </div> -->
+		</div>
+	</div>
+</template>
+<script>
+	Date.prototype.Format = function(fmt) {
+		var o = {
+			"M+": this.getMonth() + 1, //月份
+			"d+": this.getDate(), //日
+			"h+": this.getHours(), //小时
+			"m+": this.getMinutes(), //分
+			"s+": this.getSeconds(), //秒
+			"q+": Math.floor((this.getMonth() + 3) / 3), //季度
+			"S": this.getMilliseconds() //毫秒
+		};
+		if (/(y+)/.test(fmt))
+			fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
+		for (var k in o)
+			if (new RegExp("(" + k + ")").test(fmt))
+				fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
+		return fmt;
+	};
+	//调用--
+	// var mytime=new Date(后台传来的毫秒格式的时间);
+	// var newtime=mytime.Format("需转化的时间格式比如--yyyy-MM-hh");
+
+	export default {
+		data: function() {
+			return {
+				nowTime: "",
+				weatherProphetData_17Hour: [{
+					realfeel:'',
+					speed:'',
+					temperature:'',
+					winddirection:'',
+				}],
+				weatherProphetData_1: [{
+					speed:'',
+					temperature1:'',
+					sunrise:'',
+					temperature2:'',
+					sunset:''
+				}],
+				thermometerClassName: "",
+				totalClassName: "thermometer",
+				width: "",
+				height: "",
+				weatherSwitch:true			
+			}
+		},
+		created: function() {
+			let that = this;
+			setInterval(function() {
+				that.getNowTime();
+			}, 1000);
+			// this.getHourWeatherData("90", "360", this.weatherProphetData_17Hour,this.weatherProphetData_1)
+
+		},
+		methods: {
+			weatherDaySwitch:function(){
+				this.weatherSwitch=true;
+				this.$emit("listenEven","day");
+			},
+			weatherNightSwitch:function(){
+				this.weatherSwitch=false;
+				this.$emit("listenEven","night");
+			},
+			getNowTime: function() {
+				var nowTime = new Date(new Date().getTime()).Format("hh:mm");
+				this.nowTime = nowTime;
+			},
+			// getDayWeatherData:function(weatherProphetData_1){
+			//     this.weatherProphetData_1 = weatherProphetData_1;
+			// 	console.log(this.weatherProphetData_1)
+			// },
+			getHourWeatherData: function(width, height, weatherProphetData_17Hour,weatherProphetData_1) {
+				this.weatherProphetData_1=weatherProphetData_1;
+				this.weatherProphetData_17Hour = weatherProphetData_17Hour;
+				this.width = width + "%";
+				this.height = height + "px";
+				//判断温度计的度数,list[0].maximumtem%5后 1、2取0 , 3、4取5				
+				if (parseInt(weatherProphetData_17Hour[0].temperature) % 5 == 0) {
+					this.thermometerClassName = "thermometer_" + parseInt(weatherProphetData_17Hour[0].temperature);
+				} else if (parseInt(weatherProphetData_17Hour[0].temperature) % 5 == 1 || parseInt(weatherProphetData_17Hour[0].temperature) %
+					5 == 2) {
+					this.thermometerClassName = "thermometer_" + (parseInt(weatherProphetData_17Hour[0].temperature / 5) * 5);
+				} else if (parseInt(weatherProphetData_17Hour[0].temperature) % 5 == 3 || parseInt(weatherProphetData_17Hour[0].temperature) %
+					5 == 4) {
+					this.thermometerClassName = "thermometer_" + ((parseInt(weatherProphetData_17Hour[0].temperature / 5) + 1) * 5);
+				} else if (parseInt(weatherProphetData_17Hour[0].temperature) % 5 == -1 || parseInt(weatherProphetData_17Hour[0].temperature) %
+					5 == -2) {
+					this.thermometerClassName = "thermometer_" + (parseInt(weatherProphetData_17Hour[0].temperature / 5) * -5);
+				} else if (parseInt(weatherProphetData_17Hour[0].temperature) % 5 == -3 || parseInt(weatherProphetData_17Hour[0].temperature) %
+					5 == -4) {
+					this.thermometerClassName = "thermometer_" + ((parseInt(weatherProphetData_17Hour[0].temperature / 5) + 1) * -5);
+				}
+			}
+		}
+	}
+</script>
+
+<style scoped="scoped">
+	.thermometerContainer {
+		width: 65%;
+		height: 100%;
+		/* background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#024F93), color-stop(1.5, #cccccc), to(#437193));
+		background: rgba(0, 0, 0, 0.1); */
+		background-color: #535252;
+		float: left;
+		margin: 0px auto;
+		border-radius: 20px;
+		margin-top: 1%;
+		margin-left: 5%;
+	}
+
+	.container {
+		width: 370px;
+		height: 370px;
+		margin: 0px auto;
+	}
+
+	.time {
+		width: 100px;
+		height: 30px;
+		color: white;
+		font-size: 16px;
+		margin-left: 7%;
+		margin-top: 3%;
+		
+		font-family: "microsoft yahei";
+	}
+
+	.thermometerAndTemperature {
+		width: 100%;
+		height: 150px;
+	}
+
+	.temperature {
+		width: 100px;
+		height: 100px;
+		float: left;
+		margin-top: 4.5%;
+		margin-left: 5%;
+		font-size: 68px;
+		font-family: "microsoft yahei";
+		text-align: center;
+		line-height: 140px;
+		color: white;
+	}
+
+	.temperature span {
+		font-size: 37px;
+		font-family: "microsoft yahei";
+	}
+
+	.thermometer {
+		width: 104px;
+		height: 186px;
+		margin-left: 85px;
+		float: left;
+		margin-top: -30px;
+	}
+
+	.realFeelWindDirectionSpeed {
+		width: 100%;
+		height: 80px;
+		font-size: 15px;
+		margin-top: -6%;
+		margin-left: 15px;
+	}
+
+	.realFeel {
+		width: 150px;
+		height: 40px;
+		float: left;
+		margin-left: 1.5%;
+		margin-top: -5%;
+		line-height: 40px;
+		font-size: 14px;
+		font-family: "microsoft yahei";
+		color: white;
+	}
+
+	.realFeelIcon {
+		width: 20px;
+		height: 20px;
+		margin-top: 10px;
+		float: left;
+		background: url(../../../../static/picture/thermometerCard/pic_tu_01.png) no-repeat;
+	}
+
+	.windDirection {
+		width: 150px;
+		height: 40px;
+		float: right;
+		margin-right: 6%;
+		margin-top: 4.5%;
+		line-height: 40px;
+		font-size: 14px;
+		font-family: "microsoft yahei";
+		color: white;
+	}
+
+	.windDirectionIcon {
+		width: 20px;
+		height: 20px;
+		margin-top: 10px;
+		margin-left: 10%;
+		float: left;
+		background: url(../../../../static/picture/thermometerCard/pic_tu_02.png) no-repeat;
+	}
+
+	.weatherDayTemperatureSunrise {
+		width: 100%;
+		height: 30px;
+		font-size: 15px;
+		margin-top: -5%;
+		float: left;
+	}
+	
+	
+	.weatherDayAndNightButton{
+		width: 35%;
+		height: 20px;
+		font-size: 14px;
+		float: left;
+		margin-left: 1%;
+	}
+	
+	.dayButtonWhite{
+		margin-left: 25%;
+		text-align: center;
+		line-height: 20px;
+		width: 29%;
+		height: 20px;
+		color: white;
+		font-size: 14px;
+		border-style: solid;
+		border-top-width: 0px;
+		border-right-width: 0px;
+		border-bottom-width: 3px;
+		border-bottom-color: #FFEE35;
+		border-left-width: 0px;
+		font-family: "microsoft yahei";
+		float: left;
+	}
+	.dayButtonBlack{
+		margin-left: 25%;
+		line-height: 20px;
+		text-align: center;
+		width: 29%;
+		height: 20px;
+		color: #DEDEDE;
+		font-size: 14px;
+		font-family: "microsoft yahei";
+		float: left;
+	}
+	.nightButtonWhite{
+		margin-left: 5%;
+		text-align: center;
+		line-height: 20px;
+		width: 29%;
+		height: 20px;
+		color: white;
+		font-size: 14px;
+		border-style: solid;
+		border-top-width: 0px;
+		border-right-width: 0px;
+		border-bottom-width: 3px;
+		border-bottom-color: #FFEE35;
+		border-left-width: 0px;
+		font-family: "microsoft yahei";
+		float: left;
+	}
+	.nightButtonBlack{
+		margin-left: 5%;
+		line-height: 20px;
+		text-align: center;
+		width: 29%;
+		height: 20px;
+		color: #DEDEDE;
+		font-size: 14px;
+		font-family: "microsoft yahei";
+		float: left;
+	}
+	.dayTemperature {
+		width: 26%;
+		height: 40px;
+		float: left;
+		margin-left: 5.5%;
+		margin-top: -10px;
+		line-height: 40px;
+		font-size: 14px;
+		font-family: "microsoft yahei";
+		color: white;
+	}
+	.daySunrise {
+		width: 26%;
+		height: 40px;
+		float: left;
+		margin-top: -10px;
+		/* margin-left: -60px; */
+		line-height: 40px;
+		font-size: 14px;
+		font-family: "microsoft yahei";
+		color: white;
+	}
+	.weatherNightTemperatureSunrise {
+		width: 100%;
+		height: 30px;
+		font-size: 15px;
+		margin-top: -5%;
+		float: left;
+	}
+	.nightTemperature {
+		width: 26%;
+		height: 40px;
+		float: left;
+		margin-left: 5.5%;
+		margin-top: -10px;
+		line-height: 40px;
+		font-size: 14px;
+		font-family: "microsoft yahei";
+		color: white;
+	}
+	.nightSunrise {
+		width: 26%;
+		height: 40px;
+		float: left;
+		margin-top: -10px;
+		/* margin-left: -60px; */
+		line-height: 40px;
+		font-size: 14px;
+		font-family: "microsoft yahei";
+		color: white;
+	}
+
+	.speed {
+		width: 150px;
+		height: 40px;
+		float: left;
+		margin-top: -2%;
+		margin-left: 1.5%;
+		line-height: 40px;
+		font-size: 14px;
+		font-family: "microsoft yahei";
+		color: white;
+	}
+
+	.speedIcon {
+		width: 20px;
+		height: 20px;
+		margin-top: 10px;
+		float: left;
+		background: url(../../../../static/picture/thermometerCard/pic_tu_03.png) no-repeat;
+	}
+
+
+	/*0℃*/
+
+	.thermometer_0 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/0C.png) no-repeat 0px 0px;
+	}
+
+
+	/*5℃*/
+
+	.thermometer_5 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/5C.png) no-repeat 0px 0px;
+	}
+
+
+	/*-5℃*/
+
+	.thermometer_-5 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/-5C.png) no-repeat 0px 0px;
+	}
+
+
+	/*10℃*/
+
+	.thermometer_10 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/10C.png) no-repeat 0px 0px;
+	}
+
+
+	/*-10℃*/
+
+	.thermometer_-10 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/-10C.png) no-repeat 0px 0px;
+	}
+
+
+	/*15℃*/
+
+	.thermometer_15 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/15C.png) no-repeat 0px 0px;
+	}
+
+
+	/*-15℃*/
+
+	.thermometer_-15 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/-15C.png) no-repeat 0px 0px;
+	}
+
+
+	/*20℃*/
+
+	.thermometer_20 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/20C.png) no-repeat 0px 0px;
+	}
+
+
+	/*-20℃*/
+
+	.thermometer_-20 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/-20C.png) no-repeat 0px 0px;
+	}
+
+	/* 25℃*/
+	
+	.thermometer_25 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/25C.png) no-repeat 0px 0px;
+	}
+	
+	/* -25℃*/
+	
+	.thermometer_-25 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/-25C.png) no-repeat 0px 0px;
+	}
+	
+	/*30℃*/
+
+	.thermometer_30 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/30C.png) no-repeat 0px 0px;
+	}
+
+
+	/*-30℃*/
+
+	.thermometer_-30 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/-30C.png) no-repeat 0px 0px;
+	}
+
+
+	/*40℃*/
+
+	.thermometer_40 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/40C.png) no-repeat 0px 0px;
+	}
+
+
+	/*-40℃*/
+
+	.thermometer_-40 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/-40C.png) no-repeat 0px 0px;
+	}
+
+
+	/*45℃*/
+
+	.thermometer_45 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/45C.png) no-repeat 0px 0px;
+	}
+
+
+	/*-45℃*/
+
+	.thermometer_-45 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/-45C.png) no-repeat 0px 0px;
+	}
+
+
+	/*50℃*/
+
+	.thermometer_50 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/50C.png) no-repeat 0px 0px;
+	}
+
+
+	/*-50℃*/
+
+	.thermometer_-50 {
+		background: url(../../../../static/picture/thermometerCard/thermometer/-50C.png) no-repeat 0px 0px;
+	}
+</style>

+ 884 - 0
components/weatherProphethomepage/weathercomponents/weatherCalendarCardList40/weatherCalendarCard40/weatherCalendarCard40.vue

@@ -0,0 +1,884 @@
+<template>
+	<view>
+		<div :class="container" :style="{ 'width': width, 'height': height }">
+			<div :class="date" :style="{'font-size':dateFontSize,'margin-top':marginTop}">{{ newDate }}</div>
+			<div class="temperature" :style="{'font-size':otherFontSize,'margin-top':marginTop}">{{ weatherProphetData_40.temperature1 }}/{{ weatherProphetData_40.temperature2 }}℃</div>
+			<div class="weather" :style="{'font-size':otherFontSize, height: weatherHeight,'margin-top':marginTop}">
+				<div :class="[weatherClassName, weatherIconTotalClass]" :style="{ width: iconWidth, height: iconHeight }"></div>
+				{{ weather }}
+			</div>
+			<div class="wind" :style="{'font-size':otherFontSize,'margin-top':marginTop}">{{ weatherProphetData_40.winddirection1 }}风</div>
+		</div>
+	</view>
+</template>
+
+<script>
+	import utils from '../../../../tools/shoyu-date/utils.filter.js';
+	
+Date.prototype.Format = function(fmt) {
+	var o = {
+		'M+': this.getMonth() + 1, //月份
+		'd+': this.getDate(), //日
+		'h+': this.getHours(), //小时
+		'm+': this.getMinutes(), //分
+		's+': this.getSeconds(), //秒
+		'q+': Math.floor((this.getMonth() + 3) / 3), //季度
+		S: this.getMilliseconds() //毫秒
+	};
+	if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + '').substr(4 - RegExp.$1.length));
+	for (var k in o) if (new RegExp('(' + k + ')').test(fmt)) fmt = fmt.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ('00' + o[k]).substr(('' + o[k]).length));
+	return fmt;
+};
+//调用--
+// var mytime=new Date(后台传来的毫秒格式的时间);
+// var newtime=mytime.Format("需转化的时间格式比如--yyyy-MM-hh");
+export default {
+	data() {
+		return {
+			container: '',
+			date: 'dateGray',
+			newDate: '',
+			classNameWeatherBackgroundColor: "threeGradeBlue",
+			weatherIconTotalClass: 'WeatherIconTotalClass',
+			weatherClassName: '',
+			width: '',
+			height: '',
+			margin: '2px',
+			weatherProphetData_40:"",
+			weather:"",
+			// 直接使用需要进行声明
+			utils: utils,
+			// 直接使用需要进行声明 End
+			timestamp:"",
+			windowWidth:"",
+			windowHeight:"",
+			dateFontSize:"",
+			otherFontSize:"",
+			weatherHeight:"",
+			iconWidth:"",
+			iconHeight:"",
+			marginTop:""
+		};
+	},
+	created:function(){
+		//this.getWeatherData("79","100",this.classNameWeatherBackgroundColor,this.weatherClassName,this.weatherProphetData_40)
+		this.windowWidth=uni.getSystemInfoSync().windowWidth;
+		this.windowHeight=uni.getSystemInfoSync().windowHeight;
+		if(this.windowWidth>=768){
+			this.dateFontSize="20px";
+			this.otherFontSize="16px";
+			this.weatherHeight="34px";
+			this.iconWidth="40px";
+			this.iconHeight="34px";
+			this.marginTop="5px";
+		}else{
+			this.dateFontSize="16px";
+			this.otherFontSize="12px";
+			this.weatherHeight="30px";
+			this.iconWidth="29px";
+			this.iconHeight="30px";
+			this.marginTop="0";
+		}
+	},
+	methods: {
+		getWeatherData: function(width, height, classNameWeatherBackgroundColor, classNameWeatherIcon, weatherProphetData_40) {
+			this.width = "calc("+width+"% - 4px)";
+			this.height = height + 'px';
+			this.classNameWeatherBackgroundColor = classNameWeatherBackgroundColor;
+			this.weatherClassName = classNameWeatherIcon;
+			this.weatherProphetData_40 = weatherProphetData_40;
+			if(this.weatherProphetData_40.weather.search("大部分") != -1){
+				this.weather=this.weatherProphetData_40.weather;
+				this.weather=this.weather.replace("大部分","")
+			}else if(this.weatherProphetData_40.weather.search("间歇性") != -1){
+				this.weather=this.weatherProphetData_40.weather;
+				this.weather=this.weather.replace("间歇性","")
+			}else{
+				this.weather=this.weatherProphetData_40.weather;
+			}
+			this.setDate();
+			this.setBackgroundColor();
+		},
+		setDate: function() {
+			// var newDate = new Date(this.weatherProphetData_40.recodedata).Format("dd");
+			// this.newDate = newDate;
+			this.timestamp = new Date(this.weatherProphetData_40.recodedata).getTime();
+			this.newDate=this.utils.timeTodate('d',this.timestamp);
+			//console.log(this.newDate);
+			//this.timestamp = 1582560000000;
+			//console.log(this.timestamp);
+		},
+		setBackgroundColor: function() {
+			if (this.classNameWeatherBackgroundColor == 'firstGradeBlue') {
+				this.container = 'containerFirstGradeBlue';
+			} else if (this.classNameWeatherBackgroundColor == 'twoGradeBlue') {
+				this.container = 'containerTwoGradeBlue';
+			} else if (this.classNameWeatherBackgroundColor == 'threeGradeBlue') {
+				this.container = 'containerThreeGradeBlue';
+			} else if (this.classNameWeatherBackgroundColor == 'white') {
+				this.container = 'containerWhite';
+				this.date = 'dateBlack';
+			}
+		}
+	}
+};
+</script>
+
+<style scoped="scoped">
+.containerFirstGradeBlue {
+	width: 103px;
+	height: 132px;
+	margin: 2px;
+	background-color: #205ac6;
+	color: white;
+}
+
+.containerTwoGradeBlue {
+	width: 103px;
+	height: 132px;
+	margin: 2px;
+	background-color: #427ce8;
+	color: white;
+}
+
+/* .containerThreeGradeBlue {
+	width: 103px;
+	height: 132px;
+	margin: 2px;
+	background-color: transparent;	
+	color: white;
+	border: 0.5px solid #698086;
+} */
+
+.containerThreeGradeBlue {
+	/* width: 90px; */
+	/* height: 132px; */
+	margin: 2px;
+	background-color: #535252;
+	color: white;
+}
+
+.containerWhite {
+	width: 103px;
+	height: 132px;
+	margin: 2px;
+	background-color: white;
+	color: #757575;
+}
+
+.dateBlack {
+	width: 30px;
+	height: 25px;
+	/* margin-left: 2px; */
+	text-align: center;
+	font-family: 'microsoft yahei';
+	font-size: 16px;
+	font-weight: bold;
+	line-height: 25px;
+	color: black;
+}
+
+.dateGray {
+	width: 30px;
+	height: 25px;
+	/* margin-left: 2px; */
+	text-align: center;
+	font-family: 'microsoft yahei';
+	font-size: 16px;
+	font-weight: bold;
+	line-height: 25px;
+}
+
+.temperature {
+	width: 99%;
+	height: 23px;
+	text-align: right;
+	line-height: 23px;
+	font-family: 'microsoft yahei';
+	font-size: 12px;
+}
+
+.weather {
+	width: 99%;
+	height: 30px;
+	text-align: right;
+	font-family: 'microsoft yahei';
+	font-size: 12px;
+	line-height: 30px;
+	margin-right: 8px;
+}
+
+.WeatherIconTotalClass {
+	width: 29px;
+	height: 30px;
+	float: left;
+	/* margin-left: 6px; */
+}
+.wind {
+	width: 99%;
+	height: 25px;
+	text-align: right;
+	font-family: 'microsoft yahei';
+	font-size: 12px;
+	line-height: 25px;
+	clear: both;
+}
+
+/*blue22第一行*/
+
+.weatherCardList40_weatherCard40_blue22_taiYang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat 4px 2px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunTaiyang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -75px 2px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunYun {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -156px 2px;
+}
+
+.weatherCardList40_weatherCard40_blue22_taiYangYunShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -235px 2px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunShanDian {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -314px 2px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunShanDianShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -396px 2px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunShuiXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -476px 2px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -556px 2px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -635px 2px;
+}
+
+.weatherCardList40_weatherCard40_blue22_sanHengGang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -715px 2px;
+}
+
+.weatherCardList40_weatherCard40_blue22_liangdianliangyuan {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -798px 2px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunYunShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -876px 2px;
+}
+/*blue22第二行*/
+
+.weatherCardList40_weatherCard40_blue22_yunSanShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat 4px -78px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunYunSiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -75px -78px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunYunWuShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -156px -78px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunYunLiuShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -235px -78px;
+}
+
+.weatherCardList40_weatherCard40_blue22_taiYangYunXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -314px -78px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -396px -78px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunXueXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -476px -78px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunSanXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -556px -78px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunYunSiXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -635px -78px;
+}
+
+.weatherCardList40_weatherCard40_blue22_sanHengGang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -715px -78px;
+}
+
+.weatherCardList40_weatherCard40_blue22_sanDianSanYuan {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -798px -78px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunYunXueXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -876px -78px;
+}
+/*blue22第三行*/
+
+.weatherCardList40_weatherCard40_blue22_sanHengGang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat 4px -157px;
+}
+
+.weatherCardList40_weatherCard40_blue22_boLang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -75px -157px;
+}
+
+.weatherCardList40_weatherCard40_blue22_sYouJianTou {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -156px -157px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -235px -157x;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunSanShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -314px -157px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunYunSiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -396px -157px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunYunWuShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -476px -157px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunyunLiuShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -556px -157px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunXueXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -635px -157px;
+}
+
+.weatherCardList40_weatherCard40_blue22_sanHengGang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -715px -157px;
+}
+/*blue22第四行*/
+
+.weatherCardList40_weatherCard40_blue22_yunSanXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat 4px -237px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunYunSiXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -75px -237px;
+}
+
+.weatherCardList40_weatherCard40_blue22_s {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -156px -237px;
+}
+
+.weatherCardList40_weatherCard40_blue22_sShangJianTou {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -235px -237px;
+}
+
+.weatherCardList40_weatherCard40_blue22_sYouJianTou {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -314px -237px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -396px -237px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunXueXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -476px -237px;
+}
+
+.weatherCardList40_weatherCard40_blue22_quanQuan {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -556px -237px;
+}
+/*blue22第五行*/
+
+.weatherCardList40_weatherCard40_blue22_yueLiang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat 4px -318px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yueLiangYun {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -75px -318px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yueLiangYunYun {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -156px -318px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yueLiangYunShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -235px -318px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunShanDianShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -314px -318px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunShanDianShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -396px -318px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunShuiXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -476px -318px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -556px -318px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -635px -318px;
+}
+
+.weatherCardList40_weatherCard40_blue22_yunYunShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -876px -318px;
+}
+/*blue22第六行*/
+
+.weatherCardList40_weatherCard40_blue22_yueLiangYunXueXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png) no-repeat -314px -396px;
+}
+/*white22第一行*/
+
+.weatherCardList40_weatherCard40_white22_taiYang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat 4px 2px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunTaiyang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -75px 2px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunYun {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -156px 2px;
+}
+
+.weatherCardList40_weatherCard40_white22_taiYangYunShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -235px 2px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunShanDian {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -314px 2px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunShanDianShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -396px 2px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunShuiXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -476px 2px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -556px 2px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -635px 2px;
+}
+
+.weatherCardList40_weatherCard40_white22_sanHengGang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -715px 2px;
+}
+
+.weatherCardList40_weatherCard40_white22_liangdianliangyuan {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -798px 2px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunYunShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -876px 2px;
+}
+/*white22第二行*/
+
+.weatherCardList40_weatherCard40_white22_yunSanShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat 4px -78px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunYunSiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -75px -78px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunYunWuShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -156px -78px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunYunLiuShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -235px -78px;
+}
+
+.weatherCardList40_weatherCard40_white22_taiYangYunXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -314px -78px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -396px -78px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunXueXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -476px -78px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunSanXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -556px -78px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunYunSiXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -635px -78px;
+}
+
+.weatherCardList40_weatherCard40_white22_sanHengGang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -715px -78px;
+}
+
+.weatherCardList40_weatherCard40_white22_sanDianSanYuan {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -798px -78px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunYunXueXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -876px -78px;
+}
+/*white22第三行*/
+
+.weatherCardList40_weatherCard40_white22_sanHengGang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat 4px -157px;
+}
+
+.weatherCardList40_weatherCard40_white22_boLang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -75px -157px;
+}
+
+.weatherCardList40_weatherCard40_white22_sYouJianTou {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -156px -157px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -235px -157x;
+}
+
+.weatherCardList40_weatherCard40_white22_yunSanShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -314px -157px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunYunSiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -396px -157px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunYunWuShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -476px -157px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunyunLiuShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -556px -157px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunXueXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -635px -157px;
+}
+
+.weatherCardList40_weatherCard40_white22_sanHengGang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -715px -157px;
+}
+/*white22第四行*/
+
+.weatherCardList40_weatherCard40_white22_yunSanXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat 4px -237px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunYunSiXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -75px -237px;
+}
+
+.weatherCardList40_weatherCard40_white22_s {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -156px -237px;
+}
+
+.weatherCardList40_weatherCard40_white22_sShangJianTou {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -235px -237px;
+}
+
+.weatherCardList40_weatherCard40_white22_sYouJianTou {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -314px -237px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -396px -237px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunXueXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -476px -237px;
+}
+
+.weatherCardList40_weatherCard40_white22_quanQuan {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -556px -237px;
+}
+/*white22第五行*/
+
+.weatherCardList40_weatherCard40_white22_yueLiang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat 4px -318px;
+}
+
+.weatherCardList40_weatherCard40_white22_yueLiangYun {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -75px -318px;
+}
+
+.weatherCardList40_weatherCard40_white22_yueLiangYunYun {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -156px -318px;
+}
+
+.weatherCardList40_weatherCard40_white22_yueLiangYunShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -235px -318px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunShanDianShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -314px -318px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunShanDianShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -396px -318px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunShuiXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -476px -318px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -556px -318px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -635px -318px;
+}
+
+.weatherCardList40_weatherCard40_white22_yunYunShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -715px -318px;
+}
+/*white22第六行*/
+
+.weatherCardList40_weatherCard40_white22_yueLiangYunXueXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png) no-repeat -314px -396px;
+}
+
+/*white30第一行*/
+
+.weatherCardList40_weatherCard40_white30_taiYang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat 4px 2px;
+}
+
+.weatherCardList40_weatherCard40_white30_taiYangYun {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -75px 2px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunYun {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -156px 2px;
+}
+
+.weatherCardList40_weatherCard40_white30_taiYangYunShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -235px 2px;
+}
+
+.weatherCardList40_weatherCard40_white30_taiYangShanDianShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -314px 2px;
+}
+
+.weatherCardList40_weatherCard40_white30_taiYangShanDianShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -396px 2px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunShuiXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -476px 2px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -556px 2px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunLiangShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -635px 2px;
+}
+
+.weatherCardList40_weatherCard40_white30_sanHengGang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -715px 2px;
+}
+
+.weatherCardList40_weatherCard40_white30_liangDianLiangQuan {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -796px 2px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunYunShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -876px 2px;
+}
+
+
+/*white30第二行*/
+
+.weatherCardList40_weatherCard40_white30_yunSanShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat 4px -78px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunYunSiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -75px -78px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunYunWuShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -156px -78px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunYunLiuShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -235px -78px;
+}
+
+.weatherCardList40_weatherCard40_white30_taiYangYunXueXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -314px -78px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -396px -78px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunXueXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -476px -78px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunSanXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -556px -78px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunYunSiXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -635px -78px;
+}
+
+.weatherCardList40_weatherCard40_white30_sanHengGang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -715px -78px;
+}
+
+.weatherCardList40_weatherCard40_white30_sanDianSanQuan {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -798px -78px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunYunXueXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -876px -78px;
+}
+
+
+/* white30第三行*/
+
+.weatherCardList40_weatherCard40_white30_sanHengGang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat 4px -157px;
+}
+
+.weatherCardList40_weatherCard40_white30_boLang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -75px -157px;
+}
+
+.weatherCardList40_weatherCard40_white30_sYouJianTou {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -156px -157px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -235px -157px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunSanShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -314px -157px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunYunSiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -396px -157px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunYunWuShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -476px -157px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunYunLiuShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -556px -157px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunXueXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -635px -157px;
+}
+
+
+/*  white30第四行*/
+
+.weatherCardList40_weatherCard40_white30_yunSanXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat 0px -237px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunYunSiXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -75px -237px;
+}
+
+.weatherCardList40_weatherCard40_white30_s {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -156px -237px;
+}
+
+.weatherCardList40_weatherCard40_white30_sShangJianTou {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -235px -237px;
+}
+
+.weatherCardList40_weatherCard40_white30_sYouJianTou {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -314px -237px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -396px -237px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunXueXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -476px -237px;
+}
+
+
+/*white30第五行*/
+
+.weatherCardList40_weatherCard40_white30_yueLiang {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat 4px -318px;
+}
+
+.weatherCardList40_weatherCard40_white30_yueLiangYun {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -75px -318px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunYueLiangYun {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -156px -318px;
+}
+
+.weatherCardList40_weatherCard40_white30_yueLiangYunShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -235px -318px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunShanDianShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -314px -318px;
+}
+
+.weatherCardList40_weatherCard40_white30_yueShanDianShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -396px -318px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunShuiXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -476px -318px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -556px -318px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -635px -318px;
+}
+
+.weatherCardList40_weatherCard40_white30_yunYunShuiShui {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -876px -318px;
+}
+
+
+/* white30第六行*/
+
+.weatherCardList40_weatherCard40_white30_yueLiangYunXueXue {
+	background: url(../../../../../static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png) no-repeat -314px -396px;
+}
+</style>

+ 106 - 0
components/weatherProphethomepage/weathercomponents/weatherCalendarCardList40/weatherCalendarCardList40.vue

@@ -0,0 +1,106 @@
+<template>
+	<view class="container">
+		<div class="weatherCard" v-for="(item,index) in weatherProphetData_40" :key="index">
+			<weatherCalendarCard40 ref="weatherCalendarCard40"></weatherCalendarCard40>
+		</div>
+	</view>
+</template>
+
+<script>
+	
+	import weatherCalendarCard40 from '../../weathercomponents/weatherCalendarCardList40/weatherCalendarCard40/weatherCalendarCard40.vue';
+export default {
+	components: {
+		"weatherCalendarCard40":weatherCalendarCard40
+	},
+	data() {
+		return {
+			width:"",
+			height:"",
+			weatherProphetData_40:[],
+			classNameWeatherBackgroundColor: "threeGradeBlue",
+			weatherIcons: [],
+			classNameWeatherIconWhite:[],
+			windowWidth:"",
+			windowHeight:"",
+			url:""
+		};
+	},
+	created() {
+		this.windowWidth=uni.getSystemInfoSync().windowWidth;
+		this.windowHeight=uni.getSystemInfoSync().windowHeight;
+		if(this.windowWidth>=768){
+			this.url="http://49.4.78.143:8081/WeatherfdController/weatherInformationChangePictureName?model=weatherCardList40,weatherCard40,white30&weatherInformation="
+		}else{
+			this.url="http://49.4.78.143:8081/WeatherfdController/weatherInformationChangePictureName?model=weatherCardList40,weatherCard40,white22&weatherInformation="
+		}
+	},
+	methods: {
+		getWeatherData40(width,height,weatherProphetData_40){
+			let _this=this;
+			this.width=width;
+			this.height=height;
+			this.weatherProphetData_40 = weatherProphetData_40;
+			//console.log(weatherProphetData_40);
+			this.weatherIcons=[];
+			for(let i = 0; i < this.weatherProphetData_40.length; i++) {
+				this.weatherIcons.push(this.weatherProphetData_40[i].weather);
+			}
+			this.commitData();			
+			
+			
+		},
+		commitData:async function() {
+			//获取图标请求
+			let _this=this;
+			await uni.request({
+				url: this.url+ this.weatherIcons,
+					data:{
+					},
+					method:'GET',
+					success: function(res) {
+						//console.log(res.data)
+						_this.classNameWeatherIconWhite=[];
+						for(let i=0;i<res.data.length;i++){
+							_this.classNameWeatherIconWhite.push(res.data[i]);
+						}
+						for(let i=0;i<_this.weatherProphetData_40.length;i++){
+							_this.$nextTick(function() {
+								this.$refs.weatherCalendarCard40[i].getWeatherData(this.width,this.height,this.classNameWeatherBackgroundColor, this.classNameWeatherIconWhite[i], this.weatherProphetData_40[i]);
+							})
+						}
+					},
+					fail: () => {
+						_this.tips="网络错误,小程序端请检查合法域名";
+					},
+				});	
+			
+		},	
+		pushWeatherData(){
+			let _this=this;
+			for(let i=0;i<this.weatherProphetData_40.length;i++){
+				this.$nextTick(function() {
+					console.log(_this.classNameWeatherIconWhite[0]);
+					//this.$refs.weatherCalendarCard40[i].getWeatherData(this.width,this.height,this.classNameWeatherBackgroundColor, this.classNameWeatherIconWhite[i], this.weatherProphetData_40[i]);
+				})
+			}
+		}
+	}
+};
+</script>
+
+<style scoped="scoped">
+	.container{
+		margin: 0px auto;
+		width: 90%;
+		height: auto;
+		/* margin-left: 22px; */
+		
+		/* border: 0.5px solid #698086; */
+	}
+	.weatherCard{
+		width: 25%;
+		float: left;
+		/* margin-left: 6px; */
+	}
+</style>

+ 496 - 0
components/weatherProphethomepage/weathercomponents/weatherCalendarCardList8_15/weatherCalendarCard8_15/weatherCalendarCard8_15.vue

@@ -0,0 +1,496 @@
+<template>
+	<div class="weatherProphet8_15" :style="{'width':weatherProphet8_15Width,'height':weatherProphet8_15Height}">
+		<div class="date" :style="{'font-size':dateSize}">{{month}}月{{day}}</div>
+		<div class="cardContaine" :style="{'height':cardContaineHeight}">
+			<div class="time" :style="{'line-height':timeLineHeight,'background-color':timeBackgroundColor,'font-size':timeSize,'height':timeHeight,'width':timeDayWidth}">
+				{{week}}&nbsp;{{day}}
+			</div>
+			<div class="weatherIcon" :style="{'background-color':weatherIconBackgroundColor,'width':timeWidth,'height':weatherIconHeight}">
+				<div :class="[dayWeatherClassName,dayWeatherIconTotalClass]" :style="{'margin-top':dayWeatherIconTotalClassMarginTop,'margin-left':dayWeatherIconTotalClassMarginLeft}"></div>
+				<div :class="[nightWeatherClassName,nightWeatherIconTotalClass]" :style="{'margin-top':dayWeatherIconTotalClassMarginTop,'margin-right':dayWeatherIconTotalClassMarginRight}"></div>
+			</div>
+				<div class="weather" :style="{'line-height':timeLineHeight,'font-size':weatherSize}">
+					{{weatherProphetData_8_15.weather}}
+				</div>
+				<div class="temperature" :style="{'line-height':timeLineHeight,'font-size':temperatureSize}">
+					<span>{{weatherProphetData_8_15.temperature1}}℃</span>/{{weatherProphetData_8_15.temperature2}}℃
+				</div>
+				<div class="winddirection" :style="{'line-height':timeLineHeight,'font-size':winddirectionSize}">
+					{{weatherProphetData_8_15.winddirection1}}
+				</div>
+				<div class="speed" :style="{'line-height':timeLineHeight,'font-size':speedSize}">
+					{{weatherProphetData_8_15.speed1}}km/h
+				</div>
+		</div>
+	</div>
+</template>
+
+<script>
+	import utils from '../../../../tools/shoyu-date/utils.filter.js';
+	export default {
+		data: function() {
+			return {
+				windowWidth:'',
+				windowHeight:'',
+				timeDayWidth:"",
+				dateSize:'',
+				timeWidth:'',
+				timeHeight:'',
+				timeSize:'',
+				weatherSize:'',
+				temperatureSize:'',
+				weatherProphet8_15Width:'',
+				weatherProphet8_15Height:'',
+				dayWeatherIconTotalClassMarginLeft:'',
+				dayWeatherIconTotalClassMarginRight:'',
+				dayWeatherIconTotalClassMarginTop:'',
+				winddirectionSize:'',
+				speedSize:'',
+				cardContaineHeight:'',
+				timeLineHeight:'',
+				weatherIconHeight:'',
+				weatherProphetData_8_15: "",
+				width: "",
+				height: "",
+				week: "",
+				day: "",
+				month:"",
+				newDate: '',
+				utils: utils,
+				timestamp:"",
+				dayWeatherIconTotalClass: "dayWeatherIconTotalClass",
+				dayWeatherClassName: "",
+				nightWeatherIconTotalClass: "nightWeatherIconTotalClass",
+				nightWeatherClassName: "",
+				classNameweatherIconBackgroundColor: "",
+				weatherIconBackgroundColor: "",
+				timeBackgroundColor: "",
+				iconMarginTop: ""
+			}
+		},
+		created:function(){
+			this.windowWidth=uni.getSystemInfoSync().windowWidth;
+			this.windowHeight=uni.getSystemInfoSync().windowHeight;
+			if(this.windowWidth>=768){
+				this.dateSize="24px";
+				this.timeDayWidth="22%";
+				this.timeWidth="15%";
+				this.timeSize="20px";
+				this.timeHeight="70px";
+				this.weatherSize="20px";
+				this.temperatureSize="20px";
+				this.weatherProphet8_15Width="88%";
+				this.weatherProphet8_15Height="140px";
+				this.winddirectionSize="20px";
+				this.speedSize="20px";
+				this.cardContaineHeight="70px";
+				this.timeLineHeight="70px";
+				this.weatherIconHeight="70px";
+				this.dayWeatherIconTotalClassMarginLeft="10px";
+				this.dayWeatherIconTotalClassMarginTop="20px";
+				this.dayWeatherIconTotalClassMarginRight="10px";
+			}
+			else{
+				this.dateSize="14px";
+				this.timeDayWidth="16%";
+				this.timeWidth="23%";
+				this.timeSize="10px";
+				this.timeHeight="40px";
+				this.weatherSize="10px";
+				this.temperatureSize="10px";
+				this.weatherProphet8_15Width="86%";
+				this.weatherProphet8_15Height="100px";
+				this.winddirectionSize="10px";
+				this.speedSize="10px";
+				this.cardContaineHeight="40px";
+				this.timeLineHeight="40px";
+				this.weatherIconHeight="40px";
+				this.dayWeatherIconTotalClassMarginLeft="3px";
+				this.dayWeatherIconTotalClassMarginTop="3px";
+				this.dayWeatherIconTotalClassMarginRight="4px";
+			}
+		},
+		methods: {
+			getWeatherData: function(width, height, classNameweatherIconBackgroundColor, classNameDay, classNameNight,
+				weatherProphetData_8_15) {
+				this.width = width + "%";
+				this.height = height + "px";
+				this.iconMarginTop = (height - 31) / 2 + "px";
+				this.weatherProphetData_8_15 = weatherProphetData_8_15;
+				this.dayWeatherClassName = classNameDay;
+				this.nightWeatherClassName = classNameNight;
+				this.classNameweatherIconBackgroundColor = classNameweatherIconBackgroundColor;
+				this.setTime();
+				this.setBackgroundColor();
+			},
+			setTime: function() {
+				let newWeek = new Date(this.weatherProphetData_8_15.recodedata).getDay();
+				if (newWeek == 0) {
+					this.week = "周日";
+				}
+				if (newWeek == 1) {
+					this.week = "周一";
+				}
+				if (newWeek == 2) {
+					this.week = "周二";
+				}
+				if (newWeek == 3) {
+					this.week = "周三";
+				}
+				if (newWeek == 4) {
+					this.week = "周四";
+				}
+				if (newWeek == 5) {
+					this.week = "周五";
+				}
+				if (newWeek == 6) {
+					this.week = "周六";
+				}
+				let newDay = new Date(this.weatherProphetData_8_15.recodedata).getDate();
+				this.day = newDay + "日";
+				this.timestamp = new Date(this.weatherProphetData_8_15.recodedata).getTime();
+				this.month = this.utils.timeTodate('m',this.timestamp);
+			},
+			setBackgroundColor: function() {
+				if (this.classNameweatherIconBackgroundColor == "firstGradeBlue") {
+					this.timeBackgroundColor = "#2F5EB0";
+					this.weatherIconBackgroundColor = "#597EC0";
+				} else if (this.classNameweatherIconBackgroundColor == "fourGradeBlue") {
+					this.timeBackgroundColor = "#60B9E3";
+					this.weatherIconBackgroundColor = "#9ED2EC";
+				} else if (this.classNameweatherIconBackgroundColor == "threeGradeBlue") {
+					this.timeBackgroundColor = "#50A5F2";
+					this.weatherIconBackgroundColor = "#73B7F5";
+				} else if (this.classNameweatherIconBackgroundColor == "twoGradeBlue") {
+					this.timeBackgroundColor = "#427CE8";
+					this.weatherIconBackgroundColor = "#6896ED";
+				}
+			}
+		}
+	}
+</script>
+
+<style scoped="scoped">
+	.date {
+		margin-top: 2%;
+		width: 100%;
+		height: 40px;
+		font-size: 14px;
+		font-family: "microsoft yahei";
+		color: white;
+
+	}
+
+	.weatherProphet8_15 {
+		margin-left: 7%;
+		width: 86%;
+		height: 110px;
+	}
+
+	.cardContaine {
+		clear: both;
+		line-height: 40px;
+		height: 70px;
+		border-radius: 10px;
+		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#024F93), color-stop(1.5, #cccccc), to(#437193));
+		background: rgba(0, 0, 0, 0.1);
+	}
+
+	.time {
+		width: 16%;
+		height: 40px;
+		line-height: 40px;
+		text-align: center;
+		font-size: 16px;
+		font-family: "microsoft yahei";
+		float: left;
+		color: white;
+		border-radius: 10px 0px 0px 10px;
+		opacity:0.8
+	}
+
+	.weatherIcon {
+		height: 40px;
+		float: left;
+		background: rgba(0, 0, 0, 0.1);
+		opacity:0.8
+	}
+
+	.dayWeatherIconTotalClass {
+		width: 32px;
+		height: 31px;
+		margin-left: 3px;
+		margin-top: 3px;
+		float: left;
+	}
+
+	.nightWeatherIconTotalClass {
+		width: 31px;
+		height: 31px;
+		margin-top: 3px;
+		margin-right: 4px;
+		float: right;
+	}
+
+	.weather {
+		width: 18%;
+		height: 100%;
+		float: left;
+		text-align: center;
+		color: white;
+		font-family: "microsoft yahei";
+	}
+
+	.temperature {
+		width: 14%;
+		height: 100%;
+		float: left;
+		text-align: center;
+		font-size: 10px;
+		color: white;
+		font-family: "microsoft yahei";
+	}
+
+	.temperature span {
+		color: red;
+	}
+
+	.winddirection {
+		width: 16%;
+		height: 100%;
+		float: left;
+		text-align: center;
+		color: white;
+		font-family: "microsoft yahei";
+	}
+
+	.speed {
+		width: 10%;
+		height: 100%;
+		float: left;
+		color: white;
+		text-align: center;
+		font-family: "microsoft yahei";
+	}
+
+
+	/*white30第一行*/
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_taiYang {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat 0px 2px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_taiYangYun {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -79px 2px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunYun {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -160px 2px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_taiYangYunShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -239px 2px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_taiYangShanDianShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -318px 2px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_taiYangShanDianShuiShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -400px 2px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunShuiXue {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -480px 2px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -560px 2px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunLiangShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -639px 2px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_sanHengGang {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -719px 2px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_liangDianLiangQuan {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -800px 2px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunYunShuiShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -880px 2px;
+	}
+
+
+	/*white30第二行*/
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunSanShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat 0px -78px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunYunSiShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -79px -78px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunYunWuShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -160px -78px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunYunLiuShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -239px -78px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_taiYangYunXueXue {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -318px -78px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunXue {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -400px -78px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunXueXue {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -480px -78px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunSanXue {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -560px -78px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunYunSiXue {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -639px -78px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_sanHengGang {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -719px -78px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_sanDianSanQuan {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -800px -78px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunYunXueXue {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -880px -78px;
+	}
+
+
+	/* white30第三行*/
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_sanHengGang {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat 0px -157px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_boLang {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -79px -157px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_sYouJianTou {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -160px -157px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunShuiShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -239px -157px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunSanShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -318px -157px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunYunSiShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -400px -157px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunYunWuShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -480px -157px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunYunLiuShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -560px -157px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunXueXue {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -639px -157px;
+	}
+
+	/*  white30第四行*/
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunSanXue {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat 0px -237px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunYunSiXue {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -79px -237px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_s {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -160px -237px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_sShangJianTou {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -239px -237px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_sYouJianTou {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -31p8x -237px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunShuiShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -400px -237px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunXueXue {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -480px -237px;
+	}
+
+
+	/*white30第五行*/
+
+		.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yueLiang {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat 0px -318px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yueLiangYun {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -79px -318px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunYueLiangYun {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -160px -318px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yueLiangYunShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -239px -318px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunShanDianShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -318px -318px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yueShanDianShuiShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -400px -318px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunShuiXue {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -480px -318px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -560px -318px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunShuiShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -639px -318px;
+	}
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yunYunShuiShui {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -880px -318px;
+	}
+
+
+	/* white30第六行*/
+
+	.weatherTemperatureWindSpeedCardList_8_15_weatherTemperatureWindSpeedCard_8_15_white30_yueLiangYunXueXue {
+		background: url(../../../../../static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png) no-repeat -318px -396px;
+	}
+</style>

+ 117 - 0
components/weatherProphethomepage/weathercomponents/weatherCalendarCardList8_15/weatherCalendarCardList8_15.vue

@@ -0,0 +1,117 @@
+<template>
+	<view class="zt">
+		<div class="container" :style="{'width':width,'height':height}">
+			<div class="leftInnerMatrix">
+				<div v-for="(item,index) in weatherProphetData_8_15" :key="index">
+					<weatherCalendarCard8_15 ref="weatherCalendarCard8_15"></weatherCalendarCard8_15>
+				</div>
+			</div>
+		</div>
+	</view>
+</template>
+
+<script>
+	import weatherCalendarCard8_15 from '../../weathercomponents/weatherCalendarCardList8_15/weatherCalendarCard8_15/weatherCalendarCard8_15.vue'
+	export default {
+		components: {
+			"weatherCalendarCard8_15": weatherCalendarCard8_15
+		},
+		data: function() {
+			return {
+				width: "",
+				height: "",
+				weatherProphetData_8_15: [],
+				// innerMatrixWidth: "",
+				// innerMatrixHeight: "",
+				weatherIconsDay: [],
+				weatherIconsNight: [],
+				classNameDay: "",
+				classNameNight: "",
+				classNameWeatherIconBackgroundColor: []
+
+			}
+		},
+		created: function() {
+
+		},
+		methods: {
+			getWeatherData: function(width, height, weatherProphetData_8_15) {			
+				this.width = width + "%";
+				this.height = height + "px";
+				this.weatherProphetData_8_15 = weatherProphetData_8_15;
+				this.weatherIconsDay = [];
+				this.weatherIconsNight = [];
+				for (let i = 0; i < weatherProphetData_8_15.length; i++) {
+					this.weatherIconsDay.push(weatherProphetData_8_15[i].weather1);
+					this.weatherIconsNight.push(weatherProphetData_8_15[i].weather2);
+				}
+				this.commitData();
+			},
+			commitData: async function() {
+				let _this = this;
+				await uni.request({
+					url: "http://49.4.78.143:8081/WeatherfdController/weatherInformationChangePictureName?model=weatherTemperatureWindSpeedCardList_8_15,weatherTemperatureWindSpeedCard_8_15,white30&weatherInformation=" +
+						this.weatherIconsDay, //仅为示例,并非真实接口地址。
+					data: {
+
+					},
+					method: 'GET',
+					success: function(res) {
+						//_this.classNameDay = "";
+						_this.classNameDay = res.data;
+					},
+					fail: (e) => {
+						console.log(e);
+					}
+				});
+				await uni.request({
+					url: "http://49.4.78.143:8081/WeatherfdController/weatherInformationChangePictureName?model=weatherTemperatureWindSpeedCardList_8_15,weatherTemperatureWindSpeedCard_8_15,white30&weatherInformation=" +
+						this.weatherIconsNight, //仅为示例,并非真实接口地址。
+					data: {
+
+					},
+					method: 'GET',
+					success: function(res) {
+						//_this.classNameNight = "";
+						_this.classNameNight = res.data;
+						_this.setWeatherIcon();
+					},
+					fail: (e) => {
+						console.log(e);
+					}
+				});
+				
+			},
+			setWeatherIcon: function() {
+				this.classNameWeatherIconBackgroundColor = [];
+				for (let i = 0; i < this.classNameDay.length; i++) {
+					if (this.classNameDay[i].toLowerCase().search("taiyang") != -1) {
+						this.classNameWeatherIconBackgroundColor.push("firstGradeBlue");
+					} else if (this.classNameDay[i].toLowerCase().search("xue") != -1) {
+						this.classNameWeatherIconBackgroundColor.push("fourGradeBlue");
+					} else if (this.classNameDay[i].toLowerCase().search("shui") != -1 || this.classNameDay[i].toLowerCase().search(
+							"sanhenggang") != -1) {
+						this.classNameWeatherIconBackgroundColor.push("threeGradeBlue");
+					} else {
+						this.classNameWeatherIconBackgroundColor.push("twoGradeBlue");
+					}
+				}
+				this.pushWeatherData();
+			},
+			pushWeatherData: function() {
+				
+				for (let i = 0; i < this.weatherProphetData_8_15.length; i++) {
+					this.$nextTick(function(){
+						this.$refs.weatherCalendarCard8_15[i].getWeatherData(this.width, this.height,
+							this.classNameWeatherIconBackgroundColor[i], this.classNameDay[i], this.classNameNight[i], this.weatherProphetData_8_15[
+								i]);
+					})
+					
+				}
+			}
+		}
+	}
+</script>
+
+<style scoped="scoped">
+</style>

+ 431 - 0
components/weatherProphethomepage/weathercomponents/weatherTemperatureWindSpeedCard_7/WeatherTemperatureWindSpeedCard_7.vue

@@ -0,0 +1,431 @@
+<template>
+	<div>
+		<div class="weatherDay7" :style="{'margin-left':marginleft}">
+			<div :key="index" class="weatherParentComponent" :style="{'width':width7}" @tap="changeTap(item)" v-for="(item,index) in weatherProphetData_7">
+				<div :class="[classNameweatherIconBackgroundColor,bgcolor]" :style="{'width':assemblyWidth,'height':assemblyHeight}">
+					<div class="assembly_time l" :style="{'margin-left':timeleft}"> {{ utils.timeTodate('d', item.recodedata) }}日</div>
+					<!--<div class="today_time l">今天</div>-->
+					<div :class="[classNameDay[index],assembly_1_page]" :style="{'margin-left':tuleft}"></div>
+					<div :class="[classNameNight[index],assembly_2_page]" :style="{'margin-left':tuleft}"></div>
+					<div class="assembly_weather l" :style="{'margin-left':weatherleft}">{{item.weather}}</div>
+					<div class="assembly_temperature l" :style="{'margin-left':temperleft}">{{item.temperature2}}~{{item.temperature1}}℃</div>
+					<div class="assembly_wind l" :style="{'margin-left':weatherleft}">{{item.speed1}}km/h</div>
+				</div>
+
+			</div>
+		</div>
+	</div>
+
+</template>
+
+<script>
+	import utils from '@/components/tools/shoyu-date/utils.filter.js';
+	export default {
+		data: function() {
+			return {
+				classNameweatherIconBackgroundColor: [],
+				bgcolor: "lightBlue",
+				assemblyWidth: '',
+				assemblyHeight: '',
+				weatherProphetData_7: [],
+				assembly_1_page: "assembly_1",
+				classNameDay: [],
+				classNameNight: [],
+				assembly_2_page: "assembly_2",
+				weatherIconsDay:[],
+				weatherIconsNight:[],
+				// 直接使用需要进行声明
+				utils: utils,
+				// 直接使用需要进行声明 End
+				timestamp: "",
+				windowWidth:"",
+				windowHeight:"",
+				marginleft:'',
+				width7:'',
+				timeleft:'',
+				tuleft:'',
+				weatherleft:'',
+				temperleft:'',
+			}
+		},
+		created: function() {
+			this.windowWidth=uni.getSystemInfoSync().windowWidth;
+			this.windowHeight=uni.getSystemInfoSync().windowHeight;
+			if(this.windowWidth>=768){
+				this.marginleft="5%";
+				this.width7="150px";
+				this.timeleft="30px";
+				this.tuleft="62px";
+				this.weatherleft="27px"
+				this.temperleft="28px";
+			}else{
+				this.marginleft="20px";
+			}
+		},
+		methods: {
+			changeTap: function(item) {
+				let itemString = JSON.stringify(item);
+				this.$emit("listenEven", itemString);
+			},
+			setDate: function() {
+				// var newDate = new Date(this.weatherProphetData_40.recodedata).Format("dd");
+				// this.newDate = newDate;
+				this.timestamp = new Date(this.weatherProphetData_7.recodedata).getTime();
+				this.newDate = this.utils.timeTodate('d', this.timestamp);
+				// this.timestamp = 1582560000000;
+				// console.log(this.timestamp);
+			},
+			weatherInformationCard: function(assemblyWidth, assemblyHeight, classNameDay, classNameNight, weatherProphetData_7) {
+				//console.log(this.weatherProphetData_7);
+				let _this = this;
+				this.assemblyWidth = assemblyWidth + "px";;
+				this.assemblyHeight = assemblyHeight + "%";
+				this.classNameDay = classNameDay;
+				this.classNameNight = classNameNight;
+				this.weatherIconsDay = [];
+				this.weatherIconsNight = [];
+				this.weatherProphetData_7 = weatherProphetData_7;
+				for (let i = 0; i < _this.weatherProphetData_7.length; i++) {
+					_this.weatherIconsDay.push(_this.weatherProphetData_7[i].weather1);
+					_this.weatherIconsNight.push(_this.weatherProphetData_7[i].weather2);
+					// console.log(_this.weatherIconsNight)
+				}
+				uni.request({
+					url: 'http://49.4.78.143:8081/WeatherfdController/weatherInformationChangePictureName?model=weatherProphet_7,weatherDataTable_7,white30&weatherInformation=' +
+						this.weatherIconsDay,
+					success: function(res) {
+						_this.classNameDay = [];
+						for (let i = 0; i < res.data.length; i++) {
+							_this.classNameDay.push(res.data[i]);
+						}
+					},
+					fail: (e) => {
+						_this.tips = "网络错误"
+					},
+				});
+				uni.request({
+					url:'http://49.4.78.143:8081/WeatherfdController/weatherInformationChangePictureName?model=weatherProphet_7,weatherDataTable_7,white30&weatherInformation=' + this.weatherIconsNight,
+					success: function(res) {
+						_this.classNameNight = [];
+						for (let i = 0; i < res.data.length; i++) {
+							_this.classNameNight.push(res.data[i]);
+						}
+						// console.log(_this.classNameNight)
+					},
+					fail: (e) => {
+						_this.tips = "网络错误"
+					},
+				});
+				this.setDate();
+				this.changeTap(this.weatherProphetData_7[0]);
+
+			},
+		},
+	}
+</script>
+
+<style scoped="scoped">
+	.assembly_time {
+		height: 23px;
+		width: 100%;
+		border: 0px;
+		font-size: 16px;
+		margin-top: 5%;
+		color: #FFF;
+		text-decoration: none;
+		font-family: "Microsoft Yahei", Arial, Helvetica, sans-serif;
+		text-align: center;
+	}
+
+	.assembly_2 {
+		height: 31px;
+		width: 31px;
+		border: 0px;
+		margin-top: 10%;
+		margin-left: 35%;
+		background-position: 0px 0px;
+	}
+
+	.assembly_1 {
+		height: 31px;
+		width: 31px;
+		border: 0px;
+		margin-top: 10%;
+		margin-left: 35%;
+		background-position: 0px 80px;
+	}
+
+	.assembly_weather {
+		height: 23px;
+		width: 100%;
+		border: 0px;
+		font-size: 16px;
+		color: #FFF;
+		text-decoration: none;
+		font-family: "Microsoft Yahei", Arial, Helvetica, sans-serif;
+		text-align: center;
+		margin-top: 30px;
+		font-weight: bold;
+	}
+
+	.assembly_temperature {
+		height: 23px;
+		width: 100%;
+		border: 0px;
+		font-size: 16px;
+		color: #FFF;
+		text-decoration: none;
+		font-family: "Microsoft Yahei", Arial, Helvetica, sans-serif;
+		text-align: center;
+		margin-top: 15%;
+		font-weight: bold;
+
+	}
+
+	.assembly_wind {
+		height: 23px;
+		width: 100%;
+		border: 0px;
+		font-size: 16px;
+		color: #FFF;
+		text-decoration: none;
+		font-family: "Microsoft Yahei", Arial, Helvetica, sans-serif;
+		text-align: center;
+		margin-top: 15%;
+		font-weight: normal;
+	}
+
+	.weatherParentComponent {
+		border-right: 1rpx solid white;
+		border-left: 1rpx solid white;
+		/* border:1px solid white; */
+		
+
+	}
+
+	.weatherDay7 {
+		width: 90%;
+		height: 260px;
+		/* background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#024F93), color-stop(1.5, #cccccc), to(#437193)); */
+		background-color: #242424;
+		float: left;
+		/* margin: 0px auto; */
+		/* border-radius: 20px; */
+		margin-top: 5px;
+		margin-left: 20px;
+		margin-bottom: 20px;
+		margin-right: 20px;
+		display: -webkit-box;
+		overflow-x: auto;
+		/* position:fixed; */
+		/*适应苹果*/
+		-webkit-overflow-scrolling: touch;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_taiYang {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat 0px 0px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -560px 0px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunYun {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -160px 0px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_taiYang {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat 0px 0px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_taiYangYun {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat 0px 0px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunYun {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -160px 0px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_taiYangYunShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -238px 0px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_taiYangShanDianShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -314px 0px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_taiYangShanDianShuiShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -396px 0px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunShuiXue {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -480px 0px;
+	}
+	.weatherProphet_7_weatherDataTable_7_white30_yunLiangShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -638px 0px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_sanHengGang {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -718px 0px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_liangDianLiangQuan {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -798px 0px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunYunShuiShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -880px 0px;
+	}
+
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunSanShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat 0px -76px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunYunSiShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -76px -76px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunYunWuShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -152px -76px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunYunLiuShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -232px -76px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_taiYangYunXueXue {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -314px -76px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunXue {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -396px -76px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30__yunXueXue {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -476px -76px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunSanXue {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -556px -76px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunYunSiXue {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -638px -76px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_sanHengGang {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -718px -76px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_sanDianSanQuan {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -798px -76px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunYunXueXue {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -876px -76px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_sanHengGang {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat 0px -152px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_boLang {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -76px -152px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_sYouJianTou {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -152px -152px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunShuiShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -232px -152px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunSanShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -314px -152px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunYunSiShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -396px -152px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunYunWuShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -476px -152px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunYunLiuShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -556px -152px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunXueXue {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -638px -152px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunSanXue {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat 0px -232px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunYunSiXue {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -76px -232px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_s {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -152px -232px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_sShangJianTou {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -232px -232px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_sYouJianTou {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -314px -232px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunShuiShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -396px -232px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunXueXue {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -476px -232px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yueLiang {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat 0px -314px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yueLiangYun {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -76px -314px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunYueLiangYun {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -152px -314px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yueLiangYunShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -232px -314px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunShanDianShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -314px -314px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yueShanDianShuiShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -396px -314px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunShuiXue {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -481px -318px;
+	}
+	.weatherProphet_7_weatherDataTable_7_white30_yunShuiShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -638px -314px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yunYunShuiShui {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -876px -314px;
+	}
+
+	.weatherProphet_7_weatherDataTable_7_white30_yueLiangYunXueXue {
+		background: url(../../../../static/picture/weatherTemperatureWindSpeedCard_7/white30.png) no-repeat -314px -396px;
+	}
+</style>

+ 25 - 1
pages.json

@@ -66,7 +66,31 @@
         ,{
             "path" : "components/bracelet/raceletDetails/heartbeatDetails",
             "style" : {}
-        }
+        },
+		{
+			"path":"components/weatherProphethomepage/WeatherProphethomepage",
+			"style": {}
+		},
+		{
+			"path":"components/weatherProphethomepage/weathercomponents/thermometerCard/ThermometerCard",
+			"style":{}
+		},
+		{
+			"path":"components/weatherProphethomepage/weathercomponents/weatherTemperatureWindSpeedCard_7/WeatherTemperatureWindSpeedCard_7",
+			"style":{}
+		},
+		{
+			"path":"components/weatherProphethomepage/weathercomponents/weatherCalendarCardList8_15/weatherCalendarCardList8_15",
+			"style":{}
+		},
+		{
+			"path":"components/weatherProphethomepage/weathercomponents/weatherCalendarCardList40/weatherCalendarCardList40",
+			"style":{}
+		},
+		{
+			"path":"components/weatherProphethomepage/weatherDetail/Detail",
+			"style":{}
+		}
 		
 		
     ],

+ 19 - 40
pages/forecast/Forecast.vue

@@ -1,9 +1,7 @@
 <template>
-	 
 	<view class="content">
-		 <!-- <third-comp :key="menuKey"></third-comp> -->
-		<view>
-			<cu-custom bgColor="bg-blacks" :isBack="false">
+		<view  v-if="toggleSwitch==false">
+		<cu-custom bgColor="bg-blacks" :isBack="false">
 				<block slot="right"><image src="../../static/picture/fourLine.png" style="width: 30px;height: 30px;margin-left: 2%;" @tap="openDrawer"></image></block>
 				<block slot="right">
 					<view class="icon cuIcon-notice text-white" v-if="badge != 0" style="margin-left: -70%;">
@@ -15,8 +13,7 @@
 				<block slot="right"></block>
 				<block slot="content">{{ address }}</block>
 				<block slot="right"><view class="plus" @tap="showModal" data-target="viewModal">+</view></block>
-			</cu-custom>
-		</view>
+		</cu-custom>
 		<!-- 地图组件 -->
 		<view>
 			<div><drawer ref="drawer" ></drawer></div>
@@ -24,7 +21,6 @@
 			<view class="page-body">
 				<view class="page-section page-section-gap">
 					<map  style="width: 100%; height: 253px;"
-					
 						:controls="controls"
 						:circles="circles"
 						:polyline="polyline"
@@ -37,7 +33,7 @@
 			</view>
 		</view>
 		<!--经纬度组件-->
-		<view class="InformationCard">
+		<!-- <view class="InformationCard">
 			<view class="informationCardAll">
 				<view class="informationCardTextOne">
 					<view class="informationCardText">
@@ -52,24 +48,21 @@
 					</view>
 				</view>
 			</view>
-		</view>
+		</view> -->
 		<!-- 个人信息组件 -->
-		<view class="Personal_information_W">
+		<!-- <view class="Personal_information_W">
 				<view class="name">姓名:李占国</view>
-
 				<view class="history"  @click="mapDate"> <span ></span> </view>
-
 				<view class="skills">技能:电力类,机械类</view>
-		</view>
+		</view> -->
 		<!-- 历史曲线组件 -->
-		<view class="curve">
+		<!-- <view class="curve">
 			<view class="curve_l">健康情况</view>
 			<view class="curve_r" @tap="common.navTo('/components/bracelet/braceletHistoryCurve?braceletCurve=' + braceletCurve)">历史曲线</view>
 			<div class="greater"></div>
-		</view>
+		</view> -->
 		<!-- 健康详情组件 -->
-		<view class="healthy">
-			
+		<!-- <view class="healthy">
 			<view class="healthy_H">
 				<view class="details_z">心跳频率:({{ bracelet[deviceName][targetName_xtpl][targetName_xtpl_size].value }})</view>
 				<view class="details_m">步数:({{ bracelet[deviceName][targetName_bs][targetName_bs_size].value }})</view>
@@ -80,6 +73,10 @@
 				<view class="details_m">疲劳度:({{ bracelet[deviceName][targetName_pld][targetName_pld_size].value }})</view>
 				<view class="details_y">血氧浓度:({{ bracelet[deviceName][targetName_xynd][targetName_xynd_size].value }})</view>
 			</view>
+		</view> -->
+		</view>
+		<view v-if="toggleSwitch==true">
+			<WeatherProphethomepage></WeatherProphethomepage>
 		</view>
 	</view>
 </template>
@@ -88,14 +85,17 @@
 import res from '../../common/data.json';
 import drawer from '../../components/drawer/forecastThreeLineDrawer.vue';
 import plusDrawer from '../../components/drawer/plusDrawer.vue';
+import WeatherProphethomepage from '../../components/weatherProphethomepage/WeatherProphethomepage.vue';
 var _self;
 export default {
 	components: {
 		drawer: drawer,
-		plusDrawer: plusDrawer
+		plusDrawer: plusDrawer,
+		WeatherProphethomepage:WeatherProphethomepage
 	},
 	data: function() {
 		return {
+			toggleSwitch:false,
 			menuKey:1,
 			pointKey: 'MHSFCJSFW.NX_GD_MHSF_XX_XX_XXX_XXX_CI0087',
 			socketTask_bracelet: '',
@@ -259,18 +259,6 @@ export default {
 				{
 					name: '气象预测'
 				}
-				/* 	{
-						"name": ""
-					},
-					{
-						"name": ""
-					},
-					{
-						"name": ""
-					},
-					{
-						"name": ""
-					}, */
 			],
 			plusDrawerList: [
 				{
@@ -381,16 +369,10 @@ export default {
 	},
 	methods: {
 		mapDate(){
-			
-		
-			
-			
 				if(this.bool){
-					
 					this.$delete(this.polyline[0],'points');
 					this.braceletCurve_LNG = this.bracelet[this.deviceName][this.deviceNameLng];
 					this.braceletCurve_LAT = this.bracelet[this.deviceName][this.deviceNameLat];
-					
 					this.points[0].longitude=this.bracelet[this.deviceName][this.deviceNameLng][0].value;
 					this.points[0].latitude=this.bracelet[this.deviceName][this.deviceNameLat][0].value;
 					this.points[1].longitude=this.bracelet[this.deviceName][this.deviceNameLng][this.braceletCurve_LNG.length-1].value;
@@ -444,9 +426,6 @@ export default {
 			uni.getStorageSync('windpowerstationName');
 			return uni.getStorageSync('windpowerstationName');
 		},
-		openDrawer() {
-			this.$refs.drawer.openDrawer(250, this.drawerList, this.inconList);
-		},
 		showModal(e) {
 			this.modalName = e.currentTarget.dataset.target;
 			this.$refs.plusDrawer.showModal(this.plusDrawerList, this.modalName);
@@ -538,7 +517,7 @@ export default {
 };
 </script>
 
-<style>
+<style scoped="scoped">
 body {
 	font-family: '方正兰亭细黑_GBK';
 	font-size: 20px;

二进制
static/picture/thermometerCard/pic_tu_01.png


二进制
static/picture/thermometerCard/pic_tu_02.png


二进制
static/picture/thermometerCard/pic_tu_03.png


二进制
static/picture/thermometerCard/thermometer/-10C.png


二进制
static/picture/thermometerCard/thermometer/-15C.png


二进制
static/picture/thermometerCard/thermometer/-20C.png


二进制
static/picture/thermometerCard/thermometer/-25C.png


二进制
static/picture/thermometerCard/thermometer/-30C.png


二进制
static/picture/thermometerCard/thermometer/-35C.png


二进制
static/picture/thermometerCard/thermometer/-40C.png


二进制
static/picture/thermometerCard/thermometer/-45C.png


二进制
static/picture/thermometerCard/thermometer/-50C.png


二进制
static/picture/thermometerCard/thermometer/-5C.png


二进制
static/picture/thermometerCard/thermometer/0C.png


二进制
static/picture/thermometerCard/thermometer/10C.png


二进制
static/picture/thermometerCard/thermometer/15C.png


二进制
static/picture/thermometerCard/thermometer/20C.png


二进制
static/picture/thermometerCard/thermometer/25C.png


二进制
static/picture/thermometerCard/thermometer/30C.png


二进制
static/picture/thermometerCard/thermometer/35C.png


二进制
static/picture/thermometerCard/thermometer/40C.png


二进制
static/picture/thermometerCard/thermometer/45C.png


二进制
static/picture/thermometerCard/thermometer/50C.png


二进制
static/picture/thermometerCard/thermometer/5C.png


二进制
static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/blue22.png


二进制
static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white22.png


二进制
static/picture/weatherProphet_40/weatherCalendarCardList40/weatherCalendarCard40/white30.png


二进制
static/picture/weatherTemperatureWindSpeedCard_7/blue22.png


二进制
static/picture/weatherTemperatureWindSpeedCard_7/iconall.png


二进制
static/picture/weatherTemperatureWindSpeedCard_7/white30.png


二进制
static/picture/weatherTemperatureWindSpeedCard_8_15/white30.png