晋能发电场站生产实时运营管理平台APP，首页根据ui样式调整前端页面进行修改；增加故障预警一级页面；

main.js

@@ -1,3 +1,4 @@
+// import '@/static/js/pc'
 import Vue from 'vue'
 import App from './App'
 import store from './store' // store
@@ -11,7 +12,7 @@ Vue.prototype.$store = store
 App.mpType = 'app'
 
 const app = new Vue({
-  ...App
+	...App
 })
 
-app.$mount()
+app.$mount()

pages.json

@@ -35,6 +35,12 @@
 			"navigationBarTitleText": "故障预警",
 			"navigationStyle": "custom"
 		}
+	}, {
+		"path": "pages/common/uniNavBar",
+		"style": {
+			"navigationBarTitleText": "消息",
+			"navigationStyle": "custom"
+		}
 	}],
 	"tabBar": {
 		"color": "#6A98CB",

pages/common/uniNavBar.vue

@@ -0,0 +1,224 @@
+<template>
+	<view class="messageData">
+		<view class="box-bg">
+			<uni-nav-bar :fixed="true" dark left-icon="left" background-color='#202246' title="消息" @clickLeft="back" />
+		</view>
+		<view class="messageDataCharts">
+			<qiun-data-charts type="gauge" :opts="opts" :chartData="chartData" />
+			<view class="messageDataChartsText">
+				<text>未读消息</text>
+			</view>
+		</view>
+		<view class="msg_main">
+			<view class="msg_main_com flex justify-between" style="margin-top:10px">
+				<view class="msg_main_com_left">
+					<image src="../../static/jnImage/powerPage/msgOne.png" mode=""></image>
+					<text>电量类</text>
+				</view>
+				<view class="msg_main_com_right" style="background-color: #F14E51;">
+					<text>88</text>
+				</view>
+			</view>
+			<view class="msg_main_com flex justify-between" style="margin-top:10px">
+				<view class="msg_main_com_left">
+					<image src="../../static/jnImage/powerPage/msgTwo.png" mode=""></image>
+					<text>安全生产</text>
+				</view>
+				<view class="msg_main_com_right" style="background-color: #F14E51;">
+					<text>88</text>
+				</view>
+			</view>
+			<view class="msg_main_com flex justify-between" style="margin-top:10px">
+				<view class="msg_main_com_left">
+					<image src="../../static/jnImage/powerPage/msgThree.png" mode=""></image>
+					<text>公司公告</text>
+				</view>
+				<view class="msg_main_com_right" style="background-color: #F14E51;">
+					<text>88</text>
+				</view>
+			</view>
+			<view class="msg_main_com flex justify-between" style="margin-top:10px">
+				<view class="msg_main_com_left">
+					<image src="../../static/jnImage/powerPage/msgFour.png" mode=""></image>
+					<text>会议通知</text>
+				</view>
+				<view class="msg_main_com_right" style="background-color: #F14E51;">
+					<text>88</text>
+				</view>
+			</view>
+			<view class="msg_main_com flex justify-between" style="margin-top:10px">
+				<view class="msg_main_com_left">
+					<image src="../../static/jnImage/powerPage/msgFive.png" mode=""></image>
+					<text>其他消息</text>
+				</view>
+				<view class="msg_main_com_right" style="background-color: #F14E51;">
+					<text>88</text>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				chartData: {},
+				opts: {
+					padding: undefined,
+					title: {
+						name: "66",
+						fontSize: 50,
+						color: "#fff",
+						offsetY: -5
+					},
+					subtitle: {
+						name: "",
+						fontSize: 15,
+						color: "#1890ff",
+						offsetY: 0
+					},
+					extra: {
+						gauge: {
+							type: "progress",
+							width: 20,
+							labelColor: "#666666",
+							startAngle: 0.75,
+							endAngle: 0.25,
+							startNumber: 0,
+							endNumber: 100,
+							labelFormat: "",
+							splitLine: {
+								fixRadius: -10,
+								splitNumber: 10,
+								width: 15,
+								color: "#FFFFFF",
+								childNumber: 5,
+								childWidth: 12
+							},
+							pointer: {
+								width: 24,
+								color: "auto"
+							}
+						}
+					}
+				}
+			}
+		},
+		onReady() {
+			this.getServerData();
+		},
+		methods: {
+			back() {
+				this.$tab.navigateBack()
+			},
+			getServerData() {
+				//模拟从服务器获取数据时的延时
+				setTimeout(() => {
+					let res = {
+						categories: [{
+							"value": 0.2,
+							"color": "#1890ff"
+						}, {
+							"value": 0.8,
+							"color": "#2fc25b"
+						}, {
+							"value": 1,
+							"color": "#f04864"
+						}],
+						series: [{
+							name: "完成率",
+							data: 0.66
+						}]
+					};
+					this.opts.title.name = '50'
+					this.chartData = JSON.parse(JSON.stringify(res));
+				}, 500);
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	page {
+		background-color: #202246;
+	}
+
+	.messageData {
+		width: 100vw;
+		background: url('../../static/jnImage/loginPage/windBack.png'), url('../../static/jnImage/loginPage/backWav.png');
+		background-repeat: no-repeat, repeat;
+		background-size: 100% 260px, 100% 5px;
+
+		.box-bg {
+			width: 100vw;
+			padding: 5px 0;
+		}
+
+		.messageDataCharts {
+			width: 100%;
+			height: 300px;
+			position: relative;
+
+			.messageDataChartsText {
+				width: 30%;
+				height: 30px;
+				line-height: 30px;
+				background: #4287FF;
+				border-radius: 15px;
+				text-align: center;
+				position: absolute;
+				bottom: 30px;
+				left: 35%;
+
+				text {
+
+					color: #fff;
+					font-size: 30upx;
+				}
+			}
+		}
+
+		.msg_main {
+			padding: 0 20px;
+
+			.msg_main_com {
+				padding: 10px;
+				background-color: #3F4572;
+				border-radius: 5px;
+
+				.msg_main_com_left {
+					image {
+						width: 30px;
+						height: 30px;
+						position: relative;
+						top: 1px;
+						margin-right: 10px;
+					}
+
+					text {
+						font-size: 30upx;
+						color: #fff;
+						position: relative;
+						top: -8px;
+					}
+				}
+
+				.msg_main_com_right {
+					width: 25px;
+					height: 25px;
+					text-align: center;
+					border-radius: 5px;
+					position: relative;
+					top: 6px;
+
+					text {
+						color: #fff;
+						position: relative;
+						top: 6px;
+					}
+				}
+			}
+		}
+	}
+</style>

pages/home/index.vue

@@ -1,15 +1,14 @@
 <template>
 	<view class="home">
 		<view class="home_header">
-			<view class="header_message">
-				<image src="../../static/jnImage/indexPage/message.png"></image>
+			<view class="header_message" @click="changeMsg">
+				<image src="../../static/jnImage/indexPage/alarmSet.png"></image>
 			</view>
 			<view class="header_title">
-				<image src="../../static/jnImage/loginPage/logo.png" mode=""></image>
-				<text class="titleName">晋能新能源蒙东分公司</text>
+				<text class="titleName">发电场站生产实时运营管理平台</text>
 			</view>
 			<view class="header_more">
-				<image src="../../static/jnImage/indexPage/more.png"></image>
+				<image src="../../static/jnImage/indexPage/moreNew.png"></image>
 			</view>
 		</view>
 		<view class="home_main">
@@ -21,26 +20,36 @@
 					<text>09:19</text>
 				</view>
 				<view class="mesAll">
-					<view class="mesEx" v-for="(item,index) in mesExData" :key="index">
-						<view class="mesEx_left">
-							<text class="mesEx_left_top">
-								<text class="nameSty">{{item.leftName}}</text>
-							</text>
-							<view class=" mesEx_left_end">
-								<text>{{item.leftValue}}</text>
-								<text>{{item.leftCode}}</text>
+					<uni-row class="mesEx">
+						<uni-col :span="12" v-for="(item,index) in mesExData" :key="index">
+							<view class="mesEx_left flex">
+								<view class="mesEx_left_top">
+									<text class="nameSty">{{item.leftName}}</text>
+								</view>
+								<view class="mesEx_left_end">
+									<text>{{item.leftValue}}</text>
+									<text>{{item.leftCode}}</text>
+								</view>
 							</view>
-						</view>
-						<view class="mesEx_left">
-							<text class="mesEx_left_top">
-								<text class="nameSty">{{item.rightName}}</text>
-							</text>
-							<view class="mesEx_left_end">
-								<text>{{item.rightValue}}</text>
-								<text>{{item.rightCode}}</text>
+						</uni-col>
+					</uni-row>
+					<uni-row class="windpowerCl">
+						<uni-col :span="12" v-for="(item,index) in windPowerData" :key="index">
+							<view class="windpowerMsg">
+								<view class="windpowerMsg_com flex justify-between">
+									<text style="font-size: 28upx">{{item.name}}</text>
+									<text>{{item.code}}</text>
+								</view>
+								<view class="windpowerMsg_Data">
+									<text>{{item.value}}</text>
+								</view>
+								<view class="windpowerMsg_com flex justify-between">
+									<text>min:{{item.min}}</text>
+									<text>max:{{item.max}}</text>
+								</view>
 							</view>
-						</view>
-					</view>
+						</uni-col>
+					</uni-row>
 					<view class="windMsg">
 						<view class="flex justify-center" style="margin-bottom: 6px;">
 							<view class="windMsg_title">
@@ -52,7 +61,9 @@
 							<view class="windMsg_main_msg flex justify-between">
 								<view class="windMsgSty flex">
 									<view class="windMsgSty_left">
-										<image src="../../static/jnImage/indexPage/jieru.png" mode=""></image>
+										<image src="../../static/jnImage/indexPage/yunxingNew.png" mode=""></image>
+										<!-- <view class="windMsgCom" style="background-color: #c2c2c2">
+										</view> -->
 										<text>接入</text>
 									</view>
 									<view class="windMsgSty_right flex justify-between">
@@ -62,7 +73,7 @@
 								</view>
 								<view class="windMsgSty flex">
 									<view class="windMsgSty_left">
-										<image src="../../static/jnImage/indexPage/daiji.png" mode=""></image>
+										<image src="../../static/jnImage/indexPage/daijiNew.png" mode=""></image>
 										<text>待机</text>
 									</view>
 									<view class="windMsgSty_right flex justify-between">
@@ -74,8 +85,8 @@
 							<view class="windMsg_main_msg flex justify-between">
 								<view class="windMsgSty flex">
 									<view class="windMsgSty_left">
-										<image src="../../static/jnImage/indexPage/yunxing.png" mode=""></image>
-										<text>运行</text>
+										<image src="../../static/jnImage/indexPage/qidongNew.png" mode=""></image>
+										<text>启动</text>
 									</view>
 									<view class="windMsgSty_right flex justify-between">
 										<text>600</text>
@@ -84,8 +95,8 @@
 								</view>
 								<view class="windMsgSty flex">
 									<view class="windMsgSty_left">
-										<image src="../../static/jnImage/indexPage/guzhang.png" mode=""></image>
-										<text>故障</text>
+										<image src="../../static/jnImage/indexPage/gzdjNew.png" mode=""></image>
+										<text class="fourFont">故障\n待机</text>
 									</view>
 									<view class="windMsgSty_right flex justify-between">
 										<text>600</text>
@@ -96,8 +107,8 @@
 							<view class="windMsg_main_msg flex justify-between">
 								<view class="windMsgSty flex">
 									<view class="windMsgSty_left">
-										<image src="../../static/jnImage/indexPage/weihu.png" mode=""></image>
-										<text>维护</text>
+										<image src="../../static/jnImage/indexPage/tingjiNew.png" mode=""></image>
+										<text>停机</text>
 									</view>
 									<view class="windMsgSty_right flex justify-between">
 										<text>600</text>
@@ -106,7 +117,7 @@
 								</view>
 								<view class="windMsgSty flex">
 									<view class="windMsgSty_left">
-										<image src="../../static/jnImage/indexPage/lixian.png" mode=""></image>
+										<image src="../../static/jnImage/indexPage/lixianNew.png" mode=""></image>
 										<text>离线</text>
 									</view>
 									<view class="windMsgSty_right flex justify-between">
@@ -128,7 +139,7 @@
 							<view class="windMsg_main_msg flex justify-between">
 								<view class="windMsgSty flex">
 									<view class="windMsgSty_left">
-										<image src="../../static/jnImage/indexPage/jieruP.png" mode=""></image>
+										<image src="../../static/jnImage/indexPage/yunxingGFNew.png" mode=""></image>
 										<text>接入</text>
 									</view>
 									<view class="windMsgSty_right flex justify-between">
@@ -160,7 +171,7 @@
 								</view>
 								<view class="windMsgSty flex">
 									<view class="windMsgSty_left">
-										<image src="../../static/jnImage/indexPage/guzhang.png" mode=""></image>
+										<image src="../../static/jnImage/indexPage/guzhangNew.png" mode=""></image>
 										<text>故障</text>
 									</view>
 									<view class="windMsgSty_right flex justify-between">
@@ -172,7 +183,7 @@
 							<view class="windMsg_main_msg flex justify-between">
 								<view class="windMsgSty flex">
 									<view class="windMsgSty_left">
-										<image src="../../static/jnImage/indexPage/weihu.png" mode=""></image>
+										<image src="../../static/jnImage/indexPage/gzwhNew.png" mode=""></image>
 										<text>维护</text>
 									</view>
 									<view class="windMsgSty_right flex justify-between">
@@ -182,7 +193,7 @@
 								</view>
 								<view class="windMsgSty flex">
 									<view class="windMsgSty_left">
-										<image src="../../static/jnImage/indexPage/lixian.png" mode=""></image>
+										<image src="../../static/jnImage/indexPage/lixianNew.png" mode=""></image>
 										<text>离线</text>
 									</view>
 									<view class="windMsgSty_right flex justify-between">
@@ -243,50 +254,82 @@
 </template>
 </template>
 <script>
+	import leftIcon from '../../static/jnImage/indexPage/alarmSet.png'
 	export default {
 		onLoad: function() {},
 		data() {
 			return {
-				mesExData: []
+				mesExData: [],
+				windPowerData: [],
+				leftIcon: leftIcon
 			}
 		},
 		created() {
+			this.windPowerData = [{
+					name: '实际风速',
+					value: 7,
+					code: '(m/s)',
+					min: 6,
+					max: 8
+				},
+				{
+					name: '预测风速',
+					value: 10,
+					code: '(m/s)',
+					min: 6,
+					max: 20
+				},
+				{
+					name: '实际功率',
+					value: 191,
+					code: '(万kW)',
+					min: 0,
+					max: 200
+				},
+				{
+					name: '理论功率',
+					value: 459,
+					code: '(万kW)',
+					min: 0,
+					max: 500
+				}
+			]
 			this.mesExData = [{
 					leftName: '容量',
 					leftValue: 282.3,
 					leftCode: '(WM)',
-					rightName: '安全天数',
-					rightValue: 20,
-					rightCode: '(天)',
 				},
 				{
-					leftName: '风速',
-					leftValue: 282.3,
-					leftCode: '(m/s)',
-					rightName: '功率',
-					rightValue: 20,
-					rightCode: '(MW)',
+					leftName: '安全天数',
+					leftValue: 20,
+					leftCode: '(天)',
 				},
 				{
 					leftName: '日发电量',
 					leftValue: 282.3,
-					leftCode: '(万kWh)',
-					rightName: '理论功率',
-					rightValue: 20,
-					rightCode: '(MW)',
+					leftCode: '(万kWh)'
+				},
+				{
+					leftName: '预测电量',
+					leftValue: 282.3,
+					leftCode: '(万kWh)'
+				},
+				{
+					leftName: '月发电量',
+					leftValue: 282.3,
+					leftCode: '(万kWh)'
 				},
 				{
 					leftName: '年发电量',
 					leftValue: 282.3,
-					leftCode: '(万kWh)',
-					rightName: '月发电量',
-					rightValue: 20,
-					rightCode: '(万kWh)',
+					leftCode: '(万kWh)'
 				},
 			]
 		},
 		methods: {
-
+			changeMsg() {
+				this.$tab.navigateTo('/pages/common/uniNavBar')
+			}
 		}
 	}
 </script>
@@ -315,17 +358,17 @@
 
 				image {
 					position: relative;
-					top: 0px;
+					top: 5px;
 					left: 10px;
-					width: 30px;
-					height: 30px;
+					width: 25px;
+					height: 25px;
 				}
 			}
 
 			.header_title {
 				width: 70%;
 				position: relative;
-				left: 10px;
+				left: 5px;
 
 				image {
 					width: 28px;
@@ -336,24 +379,24 @@
 
 				.titleName {
 					line-height: 20px;
-					margin-left: 5px;
 					font-size: 36upx;
 					font-family: FZZhengHeiS-M-GB;
 					font-weight: 600;
-					letter-spacing: 2px;
 					color: #fff;
+					position: relative;
+					top: 8px;
 				}
 			}
 
 			.header_more {
 				width: 15%;
 				position: relative;
-				top: 5px;
+				top: 10px;
 				left: 10px;
 
 				image {
-					width: 30px;
-					height: 20px;
+					width: 25px;
+					height: 18px;
 				}
 			}
 		}
@@ -389,15 +432,14 @@
 
 				.mesAll {
 					.mesEx {
-						display: flex;
-						padding: 3px 0;
-						border-bottom: 1px solid rgba(255, 255, 255, 0.25);
+						// display: flex;
 						line-height: 30px;
 						color: #fff;
 
 						.mesEx_left {
-							display: flex;
-							width: 50%;
+							width: 100%;
+							border-bottom: 1px solid rgba(255, 255, 255, 0.25);
+							padding: 3px 0;
 
 							.mesEx_left_top {
 								width: 40%;
@@ -434,6 +476,30 @@
 
 					}
 
+					.windpowerCl {
+						.windpowerMsg {
+							margin-top: 10px;
+							padding: 5px 10px;
+							color: #fff;
+							background-image: url('../../static/jnImage/indexPage/windpower.png');
+							background-repeat: no-repeat;
+							background-size: cover;
+
+							.windpowerMsg_com {
+								text {
+									font-size: 24upx;
+									color: #AFB2C1;
+								}
+							}
+
+							.windpowerMsg_Data {
+								margin: 5px;
+								text-align: center;
+								font-size: 40upx;
+							}
+						}
+					}
+
 					.windMsg,
 					.powerMsg {
 						margin-top: 15px;
@@ -490,6 +556,10 @@
 											top: -26px;
 											left: 28px;
 										}
+
+										.fourFont {
+											top: -38px;
+										}
 									}
 
 									.windMsgSty_right {

pages/power/index.vue

@@ -1,15 +1,15 @@
 <template>
 	<view class="power">
 		<view class="home_header">
-			<view class="header_message">
-				<image src="../../static/jnImage/indexPage/message.png"></image>
+			<view class="header_message" @click="changeMsg">
+				<image src="../../static/jnImage/indexPage/alarmSet.png"></image>
 			</view>
 			<view class="header_title">
-				<image src="../../static/jnImage/loginPage/logo.png" mode=""></image>
-				<text class="titleName">晋能新能源蒙东分公司</text>
+				<!-- <image src="../../static/jnImage/loginPage/logo.png" mode=""></image> -->
+				<text class="titleName">发电场站生产实时运营管理平台</text>
 			</view>
 			<view class="header_more">
-				<image src="../../static/jnImage/indexPage/more.png"></image>
+				<image src="../../static/jnImage/indexPage/moreNew.png"></image>
 			</view>
 		</view>
 		<view class="power_main">
@@ -201,6 +201,9 @@
 			this.getPowerBar()
 		},
 		methods: {
+			changeMsg() {
+				this.$tab.navigateTo('/pages/common/uniNavBar')
+			},
 			getPowerBar() {
 				let opts = {
 					color: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4",
@@ -423,17 +426,17 @@
 
 				image {
 					position: relative;
-					top: 0px;
+					top: 5px;
 					left: 10px;
-					width: 30px;
-					height: 30px;
+					width: 25px;
+					height: 25px;
 				}
 			}
 
 			.header_title {
 				width: 70%;
 				position: relative;
-				left: 10px;
+				left: 5px;
 
 				image {
 					width: 28px;
@@ -444,24 +447,24 @@
 
 				.titleName {
 					line-height: 20px;
-					margin-left: 5px;
 					font-size: 36upx;
 					font-family: FZZhengHeiS-M-GB;
 					font-weight: 600;
-					letter-spacing: 2px;
 					color: #fff;
+					position: relative;
+					top: 8px;
 				}
 			}
 
 			.header_more {
 				width: 15%;
 				position: relative;
-				top: 5px;
+				top: 10px;
 				left: 10px;
 
 				image {
-					width: 30px;
-					height: 20px;
+					width: 25px;
+					height: 15px;
 				}
 			}
 		}

pages/report/index.vue

@@ -1,12 +1,146 @@
 <template>
-	<view class="home">
+	<view class="report">
+		<view class="home_header">
+			<view class="header_message" @click="changeMsg">
+				<image src="../../static/jnImage/indexPage/alarmSet.png"></image>
+			</view>
+			<view class="header_title">
+				<!-- <image src="../../static/jnImage/loginPage/logo.png" mode=""></image> -->
+				<text class="titleName">发电场站生产实时运营管理平台</text>
+			</view>
+			<view class="header_more">
+				<image src="../../static/jnImage/indexPage/moreNew.png"></image>
+			</view>
+		</view>
+		<view class="report_main">
+			<view class="report_DataAll" v-for="(item,index) in reportProgressData" :key="index">
+				<view class="report_Data flex justify-between">
+					<view class="report_Data_1 flex">
+						<image src="../../static/jnImage/indexPage/windIcon.png" mode=""></image>
+						<text>{{item.inPower}}</text>
+					</view>
+					<view class="report_Data_2">
+						<text>{{item.name}}</text>
+					</view>
+					<view class="report_Data_3">
+						<text>{{item.allPower}}</text>
+					</view>
+				</view>
+				<view class="report_Data_msg">
+					<view class="show_msg" :style="showProgress(item)">
 
+					</view>
+				</view>
+			</view>
+			<view class="yearTab">
+				<text v-for="(item,index) in yearData" :key="index" @click="changeYearTab(item)"
+					:style="item.showColor ? 'background: #4287FF;color:#fff': ''">{{item.nameZN}}</text>
+			</view>
+			<view class="reportTable">
+				<uni-table ref="table" border emptyText="暂无更多数据" width="100%">
+					<uni-tr>
+						<uni-th align="center">性能指标</uni-th>
+						<uni-th width="45" align="center">数据</uni-th>
+						<uni-th width="45" align="center">数据</uni-th>
+						<uni-th width="45" align="center">数据</uni-th>
+					</uni-tr>
+					<uni-tr v-for="(item, index) in tableData" :key="index">
+						<uni-td>{{ item.name }}</uni-td>
+						<uni-td align="center">{{ item.data1 }}</uni-td>
+						<uni-td align="center">{{ item.data2 }}</uni-td>
+						<uni-td align="center">{{ item.data3 }}</uni-td>
+					</uni-tr>
+				</uni-table>
+			</view>
+		</view>
 	</view>
 </template>
 
 <script>
 	export default {
-		onLoad: function() {}
+		onLoad: function() {},
+		data() {
+			return {
+				reportProgressData: [],
+				yearTab: 'day',
+				yearData: [],
+				tableData: []
+			}
+		},
+		created() {
+			this.tableData = [{
+					name: '指标一',
+					data1: '2.8',
+					data2: '3.6',
+					data3: '4.8'
+				},
+				{
+					name: '指标二',
+					data1: '2.8',
+					data2: '3.6',
+					data3: '4.8'
+				},
+				{
+					name: '指标三',
+					data1: '2.8',
+					data2: '3.6',
+					data3: '4.8'
+				},
+			]
+			this.reportProgressData = [{
+						inPower: '961万kWh',
+						allPower: '1865万kWh',
+						progress: '70%',
+						name: '年发电量'
+					},
+					{
+						inPower: '171天',
+						allPower: '365天',
+						progress: '56%',
+						name: '日历进度'
+					},
+					{
+						inPower: '日历进程',
+						allPower: '年发电量',
+						progress: '65%',
+						name: '完成度'
+					},
+				],
+				this.yearData = [{
+						nameZN: '日简报',
+						nameEN: 'day',
+						showColor: true
+					},
+					{
+						nameZN: '月简报',
+						nameEN: 'month',
+						showColor: false
+					},
+					{
+						nameZN: '年简报',
+						nameEN: 'year',
+						showColor: false
+
+					}
+				]
+		},
+		methods: {
+			showProgress(item) {
+				return `width: ${item.progress};`
+			},
+			changeMsg() {
+				this.$tab.navigateTo('/pages/common/uniNavBar')
+			},
+			changeYearTab(item) {
+				this.yearData.forEach(it => {
+					it.showColor = false
+					if (it.nameEN === item.nameEN) {
+						item.showColor = true
+						this.yearTab = it.nameEN
+					}
+				})
+			},
+		}
 	}
 </script>
 
@@ -15,9 +149,181 @@
 		background-color: #202246;
 	}
 
-	.home {
+	.report {
 		width: 100vw;
+		background: url('../../static/jnImage/loginPage/windBack.png'), url('../../static/jnImage/loginPage/backWav.png');
+		background-repeat: no-repeat, repeat;
+		background-size: 100% 260px, 100% 5px;
+
+		.home_header {
+			width: calc(100% -32px);
+			display: flex;
+			justify-content: space-between;
+			height: 60px;
+			padding-top: 16px;
+			// position: fixed;
+
+			.header_message {
+				width: 15%;
+
+				image {
+					position: relative;
+					top: 5px;
+					left: 10px;
+					width: 25px;
+					height: 25px;
+				}
+			}
+
+			.header_title {
+				width: 70%;
+				position: relative;
+				left: 5px;
+
+				image {
+					width: 28px;
+					height: 22px;
+					position: relative;
+					top: 5px;
+				}
+
+				.titleName {
+					line-height: 20px;
+					font-size: 36upx;
+					font-family: FZZhengHeiS-M-GB;
+					font-weight: 600;
+					color: #fff;
+					position: relative;
+					top: 8px;
+				}
+			}
+
+			.header_more {
+				width: 15%;
+				position: relative;
+				top: 10px;
+				left: 10px;
+
+				image {
+					width: 25px;
+					height: 15px;
+				}
+			}
+		}
+
+		.report_main {
+			padding: 0 20px;
+
+			.report_DataAll {
+				margin-top: 10px;
+
+				.report_Data {
+					.report_Data_1 {
+						image {
+							width: 18px;
+							height: 18px;
+						}
+
+						text {
+							margin-left: 5px;
+							font-size: 28upx;
+							color: #A49EAC;
+							position: relative;
+							top: 0px;
+						}
+					}
+
+					.report_Data_2 {
+						text {
+							font-size: 32upx;
+							color: #A49EAC;
+						}
+					}
+
+					.report_Data_3 {
+						text {
+							font-size: 28upx;
+							color: #A49EAC;
+						}
+					}
+				}
+
+				.report_Data_msg {
+					width: 100%;
+					height: 20px;
+					border-radius: 5px;
+					background: #0B143E;
+
+					.show_msg {
+						height: 20px;
+						background: #00BC6F;
+						border-radius: 5px 0 0 5px;
+					}
+				}
+			}
+
+			.yearTab {
+				width: 99%;
+				height: 30px;
+				border-radius: 5px;
+				background: #0B143E;
+				margin-top: 20px;
+
+				text {
+					display: inline-block;
+					width: 33%;
+					height: 30px;
+					text-align: center;
+					color: #4287FF;
+					line-height: 30px;
+				}
+
+				text:nth-of-type(1) {
+					border-radius: 5px 0 0 5px;
+				}
+
+				text:nth-of-type(3) {
+					border-radius: 0 5px 5px 0;
+				}
+			}
+
+			.reportTable {
+				width: 100%;
+				margin-top: 10px;
+
+				.table--border {
+					border: 1px solid rgba(255, 255, 255, 0.3);
+				}
+
+				.uni-table {
+					background-color: rgba(255, 255, 255, 0);
+
+					.uni-table-tr {
+						.table--border {
+							border: 1px solid rgba(255, 255, 255, 0.3);
+						}
+
+						.uni-table-th {
+							background-color: #2E336D;
+						}
+
+						.uni-table-th,
+						.uni-table-td {
+							color: #fff;
+							font-size: 26upx;
+
+						}
 
+						.uni-table-th:nth-of-type(1) {
+							background-color: #6C4B9E;
+						}
+					}
 
+					.uni-table-tr:hover {
+						background-color: rgba(255, 255, 255, 0);
+					}
+				}
+			}
+		}
 	}
-</style>
+</style>

pages/type/index.vue

@@ -1,15 +1,15 @@
 <template>
 	<view class="faultType">
 		<view class="home_header">
-			<view class="header_message">
-				<image src="../../static/jnImage/indexPage/message.png"></image>
+			<view class="header_message" @click="changeMsg">
+				<image src="../../static/jnImage/indexPage/alarmSet.png"></image>
 			</view>
 			<view class="header_title">
-				<image src="../../static/jnImage/loginPage/logo.png" mode=""></image>
-				<text class="titleName">晋能新能源蒙东分公司</text>
+				<!-- <image src="../../static/jnImage/loginPage/logo.png" mode=""></image> -->
+				<text class="titleName">发电场站生产实时运营管理平台</text>
 			</view>
 			<view class="header_more">
-				<image src="../../static/jnImage/indexPage/more.png"></image>
+				<image src="../../static/jnImage/indexPage/moreNew.png"></image>
 			</view>
 		</view>
 		<view class="faultType_main">
@@ -339,6 +339,9 @@
 				};
 				this.chartData = JSON.parse(JSON.stringify(res));
 			},
+			changeMsg() {
+				this.$tab.navigateTo('/pages/common/uniNavBar')
+			},
 			getPieBarwxss() {
 				let proColor = ['#5CB2EF', '#3E78C5', '#00299D', '#3EAD9F', '#3F3A99', '#5EAC88', '#5D56D0', '#CD8D23',
 					'#9F65C1', '#FD8974', '#C745B9', '#FF6B3E'
@@ -422,17 +425,17 @@
 
 				image {
 					position: relative;
-					top: 0px;
+					top: 5px;
 					left: 10px;
-					width: 30px;
-					height: 30px;
+					width: 25px;
+					height: 25px;
 				}
 			}
 
 			.header_title {
 				width: 70%;
 				position: relative;
-				left: 10px;
+				left: 5px;
 
 				image {
 					width: 28px;
@@ -443,24 +446,24 @@
 
 				.titleName {
 					line-height: 20px;
-					margin-left: 5px;
 					font-size: 36upx;
 					font-family: FZZhengHeiS-M-GB;
 					font-weight: 600;
-					letter-spacing: 2px;
 					color: #fff;
+					position: relative;
+					top: 8px;
 				}
 			}
 
 			.header_more {
 				width: 15%;
 				position: relative;
-				top: 5px;
+				top: 10px;
 				left: 10px;
 
 				image {
-					width: 30px;
-					height: 20px;
+					width: 25px;
+					height: 15px;
 				}
 			}
 		}

pages/warn/index.vue

@@ -1,12 +1,172 @@
 <template>
-	<view class="home">
-
+	<view class="warn">
+		<view class="home_header">
+			<view class="header_message" @click="changeMsg">
+				<image src="../../static/jnImage/indexPage/alarmSet.png"></image>
+			</view>
+			<view class="header_title">
+				<!-- <image src="../../static/jnImage/loginPage/logo.png" mode=""></image> -->
+				<text class="titleName">发电场站生产实时运营管理平台</text>
+			</view>
+			<view class="header_more">
+				<image src="../../static/jnImage/indexPage/moreNew.png"></image>
+			</view>
+		</view>
+		<view class="warn_main">
+			<view class="warn_main_one">
+				<view class="warn_main_one_top flex justify-between">
+					<view class="warn_main_one_top_left">
+						<image src="../../static/jnImage/powerPage/warnOne.png" mode=""></image>
+						<text>离线</text>
+					</view>
+					<view class="warn_main_one_top_right">
+						<text>88</text>
+					</view>
+				</view>
+				<view class="warn_main_one_bot">
+					<uni-row class="warn_data_row">
+						<uni-col :span="12" v-for="(item,index) in warnData" :key="index">
+							<view class="warn_data_col flex">
+								<view class="warn_data_col_left">
+									<text>{{item.name}}</text>
+								</view>
+								<view class="warn_data_col_right flex justify-between">
+									<text>{{item.inPower}}</text>
+									<text>台</text>
+								</view>
+							</view>
+						</uni-col>
+					</uni-row>
+				</view>
+			</view>
+			<view class="warn_main_com flex justify-between" style="margin:10px 0">
+				<view class="warn_main_com_left">
+					<image src="../../static/jnImage/powerPage/warnTwo.png" mode=""></image>
+					<text>实时故障预警</text>
+				</view>
+				<view class="warn_main_com_right" style="background-color: #F14E51;">
+					<text>88</text>
+				</view>
+			</view>
+			<view class="warn_main_com flex justify-between" style="margin:1px 0">
+				<view class="warn_main_com_left">
+					<image src="../../static/jnImage/powerPage/warnThree.png" mode=""></image>
+					<text>阈值预警</text>
+				</view>
+				<view class="warn_main_com_right" style="background-color: #1A41AD;">
+					<text>88</text>
+				</view>
+			</view>
+			<view class="warn_main_com flex justify-between" style="margin:1px 0">
+				<view class="warn_main_com_left">
+					<image src="../../static/jnImage/powerPage/warnFour.png" mode=""></image>
+					<text>温升预警</text>
+				</view>
+				<view class="warn_main_com_right" style="background-color: #3963AB;">
+					<text>88</text>
+				</view>
+			</view>
+			<view class="warn_main_com flex justify-between" style="margin:1px 0 10px 0">
+				<view class="warn_main_com_left">
+					<image src="../../static/jnImage/powerPage/warnFive.png" mode=""></image>
+					<text>差值预警</text>
+				</view>
+				<view class="warn_main_com_right" style="background-color: #4E8CC8;">
+					<text>88</text>
+				</view>
+			</view>
+			<view class="warn_main_com flex justify-between" style="margin:1px 0">
+				<view class="warn_main_com_left">
+					<image src="../../static/jnImage/powerPage/warnSix.png" mode=""></image>
+					<text>风场平均风速达标未启机预警</text>
+				</view>
+				<view class="warn_main_com_right" style="background-color: #208A73;">
+					<text>88</text>
+				</view>
+			</view>
+			<view class="warn_main_com flex justify-between" style="margin:1px 0">
+				<view class="warn_main_com_left">
+					<image src="../../static/jnImage/powerPage/warnSeven.png" mode=""></image>
+					<text>风机平均风速达标未启机预警</text>
+				</view>
+				<view class="warn_main_com_right" style="background-color: #5EAC88;">
+					<text>88</text>
+				</view>
+			</view>
+			<view class="warn_main_com flex justify-between" style="margin:1px 0">
+				<view class="warn_main_com_left">
+					<image src="../../static/jnImage/powerPage/warnEight.png" mode=""></image>
+					<text>设备更换周期提醒</text>
+				</view>
+				<view class="warn_main_com_right" style="background-color: #43B99F;">
+					<text>88</text>
+				</view>
+			</view>
+		</view>
 	</view>
 </template>
 
 <script>
 	export default {
-		onLoad: function() {}
+		onLoad: function() {},
+		data() {
+			return {
+				warnData: []
+			}
+		},
+		created() {
+			this.warnData = [{
+					inPower: 961,
+					allPower: 1865,
+					name: '宝龙山'
+				},
+				{
+					inPower: 852,
+					allPower: 1865,
+					name: '乌力吉'
+				},
+				{
+					inPower: 696,
+					allPower: 1865,
+					name: '浩日格吐'
+				},
+				{
+					inPower: 527,
+					allPower: 1865,
+					name: '开鲁'
+				},
+				{
+					inPower: 935,
+					allPower: 1865,
+					name: '景观'
+				},
+				{
+					inPower: 1022,
+					allPower: 1865,
+					name: '高力板'
+				},
+				{
+					inPower: 752,
+					allPower: 1865,
+					name: '书声'
+				},
+				{
+					inPower: 1520,
+					allPower: 1865,
+					name: '宝力根花'
+				},
+				{
+					inPower: 365.6,
+					allPower: 1865,
+					name: '振发'
+				}
+			]
+		},
+		methods: {
+			changeMsg() {
+				this.$tab.navigateTo('/pages/common/uniNavBar')
+			}
+		}
 	}
 </script>
 
@@ -15,9 +175,201 @@
 		background-color: #202246;
 	}
 
-	.home {
+	.warn {
 		width: 100vw;
+		background: url('../../static/jnImage/loginPage/windBack.png'), url('../../static/jnImage/loginPage/backWav.png');
+		background-repeat: no-repeat, repeat;
+		background-size: 100% 260px, 100% 5px;
+
+		.home_header {
+			width: calc(100% -32px);
+			display: flex;
+			justify-content: space-between;
+			height: 60px;
+			padding-top: 16px;
+			// position: fixed;
+
+			.header_message {
+				width: 15%;
+
+				image {
+					position: relative;
+					top: 5px;
+					left: 10px;
+					width: 25px;
+					height: 25px;
+				}
+			}
+
+			.header_title {
+				width: 70%;
+				position: relative;
+				left: 5px;
+
+				image {
+					width: 28px;
+					height: 22px;
+					position: relative;
+					top: 5px;
+				}
+
+				.titleName {
+					line-height: 20px;
+					font-size: 36upx;
+					font-family: FZZhengHeiS-M-GB;
+					font-weight: 600;
+					color: #fff;
+					position: relative;
+					top: 8px;
+				}
+			}
+
+			.header_more {
+				width: 15%;
+				position: relative;
+				top: 10px;
+				left: 10px;
+
+				image {
+					width: 25px;
+					height: 15px;
+				}
+			}
+		}
+
+		.warn_main {
+			padding: 0 20px;
+
+			.warn_main_one {
+				padding: 5px 10px;
+				background-color: #3F4572;
+				border-radius: 5px;
+
+				.warn_main_one_top {
+					.warn_main_one_top_left {
+						image {
+							width: 30px;
+							height: 30px;
+							position: relative;
+							top: 1px;
+							margin-right: 5px;
+						}
+
+						text {
+							font-size: 30upx;
+							color: #9A9BA6;
+							position: relative;
+							top: -10px;
+						}
+					}
+
+					.warn_main_one_top_right {
+						width: 20px;
+						height: 20px;
+						background-color: #686868;
+						text-align: center;
+						border-radius: 10px;
+						position: relative;
+						top: 6px;
+
+						text {
+							color: #fff;
+							position: relative;
+							top: 4px;
+						}
+					}
+
+				}
+
+				.warn_main_one_bot {
+					margin-top: 5px;
+
+					.warn_data_row {
+						.warn_data_col {
+							width: 98%;
+							height: 20px;
+							margin-bottom: 5px;
+							background: #2E336D;
+							border-radius: 5px;
+
+							.warn_data_col_left {
+								width: 50%;
+								height: 20px;
+								color: #fff;
+								font-size: 30upx;
+								background: #0B143E;
+								border-radius: 5px;
+
+								text {
+									margin-left: 5px;
+								}
+							}
+
+							.warn_data_col_right {
+								height: 20px;
+								color: #fff;
+								font-size: 32upx;
+								width: 48%;
+
+								text:nth-of-type(1) {
+									margin-left: 5px;
+									width: 50%;
+									font-size: 32upx;
+									color: #fff;
+									position: relative;
+									top: 3px;
+								}
+
+								text:nth-of-type(2) {
+									font-size: 22upx;
+									color: #96B5D5;
+									position: relative;
+									top: 3px;
+								}
+							}
+						}
+					}
+				}
+			}
+
+			.warn_main_com {
+				padding: 5px 10px;
+				background-color: #3F4572;
+				border-radius: 5px;
+
+				.warn_main_com_left {
+					image {
+						width: 30px;
+						height: 30px;
+						position: relative;
+						top: 1px;
+						margin-right: 5px;
+					}
+
+					text {
+						font-size: 30upx;
+						color: #9A9BA6;
+						position: relative;
+						top: -10px;
+					}
+				}
+
+				.warn_main_com_right {
+					width: 20px;
+					height: 20px;
+					text-align: center;
+					border-radius: 10px;
+					position: relative;
+					top: 6px;
 
+					text {
+						color: #fff;
+						position: relative;
+						top: 4px;
+					}
+				}
+			}
+		}
 
 	}
-</style>
+</style>

static/js/pc.js

@@ -0,0 +1,12 @@
+;
+(function() {
+	var u = navigator.userAgent,
+		w = window.innerWidth;
+	if (!u.match(/AppleWebKit.*Mobile.*/) || u.indexOf('iPad') > -1) {
+		var sw = w * 576 / 1920;
+		window.innerWidth = sw < 375 ? 375 : sw;
+		window.onload = function() {
+			window.innerWidth = w;
+		}
+	}
+})();

unpackage/cache/apk/apkurl

@@ -1 +0,0 @@
-https://ide.dcloud.net.cn/build/download/9ed55c20-89d4-11ee-b2b2-c785b06f33e1

unpackage/cache/certdata

@@ -1,3 +0,0 @@
-andrCertfile=C:/Users/admin/Downloads/51fa53b468425333ab600ff335a2a631.keystore
-andrCertAlias=__uni__3c15825
-andrCertPass=9WKD1ss05PPZfKiC0L46bA==

unpackage/cache/wgt/__UNI__B5DFCD0/__uniappview.html

@@ -1,25 +0,0 @@
-<!DOCTYPE html>
-<html lang="zh-CN">
-
-  <head>
-    <meta charset="UTF-8" />
-    <script>
-      var __UniViewStartTime__ = Date.now();
-      var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') ||
-        CSS.supports('top: constant(a)'))
-      document.write(
-        '<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
-        (coverSupport ? ', viewport-fit=cover' : '') + '" />')
-    </script>
-    <title>View</title>
-    <link rel="stylesheet" href="view.css" />
-  </head>
-
-  <body>
-    <div id="app"></div>
-    <script src="__uniappes6.js"></script>
-    <script src="view.umd.min.js"></script>
-    <script src="app-view.js"></script>
-  </body>
-
-</html>

unpackage/cache/wgt/__UNI__B5DFCD0/static/font/iconfont.css

@@ -1,90 +0,0 @@
-@font-face {
-  font-family: "iconfont";
-  src: url('/static/font/iconfont.ttf') format('truetype');
-}
-
-.iconfont {
-  font-family: "iconfont" !important;
-  font-size: 16px;
-  display: inline-block;
-  font-style: normal;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-.icon-user:before {
-  content: "\e7ae";
-}
-
-.icon-password:before {
-  content: "\e8b2";
-}
-
-.icon-code:before {
-  content: "\e699";
-}
-
-.icon-setting:before {
-  content: "\e6cc";
-}
-
-.icon-share:before {
-  content: "\e739";
-}
-
-.icon-edit:before {
-  content: "\e60c";
-}
-
-.icon-version:before {
-  content: "\e63f";
-}
-
-.icon-service:before {
-  content: "\e6ff";
-}
-
-.icon-friendfill:before {
-  content: "\e726";
-}
-
-.icon-community:before {
-  content: "\e741";
-}
-
-.icon-people:before {
-  content: "\e736";
-}
-
-.icon-dianzan:before {
-  content: "\ec7f";
-}
-
-.icon-right:before {
-  content: "\e7eb";
-}
-
-.icon-logout:before {
-  content: "\e61d";
-}
-
-.icon-help:before {
-  content: "\e616";
-}
-
-.icon-github:before {
-  content: "\e628";
-}
-
-.icon-aixin:before {
-  content: "\e601";
-}
-
-.icon-clean:before {
-  content: "\e607";
-}
-
-.icon-refresh:before {
-  content: "\e604";
-}
-

unpackage/cache/wgt/__UNI__B5DFCD0/static/index.html

@@ -1,20 +0,0 @@
-<!DOCTYPE html>
-<html lang="zh-CN">
-	<head>
-		<meta charset="utf-8">
-		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
-		  <meta name="renderer" content="webkit">
-		<title><%= htmlWebpackPlugin.options.title %></title>
-    <link rel="shortcut icon" type="image/x-icon" href="<%= BASE_URL %>static/favicon.ico">
-		<script>
-			var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') || CSS.supports('top: constant(a)'))
-			document.write('<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' + (coverSupport ? ', viewport-fit=cover' : '') + '" />')
-		</script>
-		<link rel="stylesheet" href="<%= BASE_URL %>static/index.<%= VUE_APP_INDEX_CSS_HASH %>.css" />
-	</head>
-	<body>
-		<noscript>
-			<strong>本站点必须要开启JavaScript才能运行.</strong>
-		</noscript>
-		<div id="app"></div>
-</html>