Browse Source

更新样式

吴洪双 5 năm trước cách đây
mục cha
commit
a28aa19566
3 tập tin đã thay đổi với 119 bổ sung46 xóa
  1. 2 2
      configs/env.js
  2. 98 33
      pages/Charts/equipmentStatistics.vue
  3. 19 11
      pages/Charts/mainStatistics.vue

+ 2 - 2
configs/env.js

@@ -9,8 +9,8 @@ let configs = {
 if (process.env.NODE_ENV === 'development') {
 	// 测试环境
 	configs = Object.assign(configs, {
-		// baseUrl: 'https://app.sunzee.com.cn/ShenzeeServer',
-		baseUrl: 'http://127.0.0.1:8090',
+		baseUrl: 'https://app.sunzee.com.cn/ShenzeeServer',
+		// baseUrl: 'http://127.0.0.1:8090',
 	});
 }
 

+ 98 - 33
pages/Charts/equipmentStatistics.vue

@@ -1,11 +1,14 @@
 <template>
 	<view>
 		<view class="head">
-			<view class="company">
-				<font style="color: #F76260;">申泽智能物联</font>
+			<view class="">
+				<image class="userFlagimg" src="../../static/img/userFlag.png" mode=""></image>
 			</view>
 			<view class="pname">
-				<font class="wenzi" style="color: #F76260;text-align:right">用户:{{pname}}</font>
+				<font class="wenzi" style="color: #BDD6F3;font-size:28upx">用户:{{pname}}</font>
+			</view>
+			<view class="company">
+				<font style="color: #BDD6F3;font-size:28upx">申泽智能物联</font>
 			</view>
 		</view>
 		<view class="qiun-columns">
@@ -381,21 +384,33 @@
 </script>
 <style>
 	page {
-		background: #F2F2F2;
+		/* background: #F2F2F2; */
+		background:#FFFFFF;
 		width: 750upx;
 		overflow-x: hidden;
 	}
 	.head{
 		display: flex;
 		flex-direction: row;
+		background:#206DC3;
+		width: 750upx;
+		height: 80upx;
+		margin-bottom: 20upx;
 	}
 	.company{
-		padding-left: 15upx;
 		width: 48%;
+		text-align:right;
 	}
 	.pname{
-		width: 48%;
-		text-align:right;
+		display: flex;
+		flex-direction: row;
+		width: 40%;
+	}
+	.userFlagimg{
+		padding-left: 10upx;
+		padding-top: 10upx;
+		width: 26upx;
+		height: 28upx;
 	}
 	.wenzi{
 		padding-right: 0upx;
@@ -404,6 +419,58 @@
 		overflow: hidden;
 		/* text-overflow: ellipsis; */
 	}
+	.ri{
+		width: 690upx;
+		height: 180upx;
+		background:#FFFFFF;
+		border-radius: 15upx;
+		/* 上移 */
+		transform: translateY(-90upx);
+		text-align:center;
+		margin: auto;
+		display: flex;
+		flex-direction: row;
+		/* 阴影 */
+		box-shadow:0upx -1upx   20upx #D3D3D3;
+		/* box-shadow:0px 0px  10px 5px #aaa; */
+	}
+	.riShell{
+		display: flex;
+		flex-direction: row;
+		margin: auto;
+	}
+	.riTitle{
+		display: flex;
+		flex-direction: column;
+		margin: auto;
+	}
+	.riqi{
+		display: flex;
+		flex-direction: column;
+		margin: auto;
+	}
+	.fourTitle{
+		width: 690upx;
+		height: 294upx;
+		display: flex;
+		flex-direction: row;
+		flex-wrap:wrap;
+		background:#FFFFFF;
+		box-shadow:0upx 0upx   20upx #D3D3D3;
+		margin: auto;
+		border-radius: 15upx;
+		transform: translateY(-60upx);
+		}
+	.four{
+		display: flex;
+		flex-direction: row;
+		margin: auto;
+		width: 48%;
+	}
+	.fourImg{
+		width: 54upx;
+		height: 54upx;
+	}
 	.qiun-padding {
 		padding: 2%;
 		width: 96%;
@@ -426,7 +493,7 @@
 	
 	.qiun-common-mt {
 		margin-top: 0upx;
-		height: 170upx;
+		height: 200upx;
 	}
 	
 	.qiun-bg-white {
@@ -439,44 +506,42 @@
 		flex-wrap: nowrap;
 		border-radius: 15upx;
 	}
-	.color{
-		background:#56de9e;
-	}
 	.qiun-title-dot-light {
-		/* border-left: 10upx solid #0ea391; */
-		padding-top: 10upx;
-		border-left: 20upx;
-		padding-left: 20upx;
-		font-family: "宋体";
-		font-size: 50upx;
-		color: #000000;
+		border-left: 30upx solid #0ea391;
+		padding-top: 20upx;
+		/* border-left: 20upx; */
+		padding-left: 10upx;
+		height: 85upx;
+		font-family: "PingFang-SC-Bold";
+		font-weight: bold;
+		margin: auto;
+		font-size: 32upx;
+		color: #363D44;
 	}
-	.qiun-title-dot-light1 {
-		/* border-left: 10upx solid #0ea391; */
-		padding-top: 10upx;
-		border-left: 20upx;
-		padding-left: 20upx;
-		font-family: "宋体";
-		font-size: 30upx;
-		color: #000000;
+	.shijian{
+		padding-top: 30upx;
+		height: 80upx;
+		width: 690upx;
+		margin: auto;
+		box-shadow:0upx 0upx 10upx #D3D3D3;
 	}
 	.qiun-charts {
-		width: 750upx;
-		height: 430upx;
+		width: 690upx;
+		height: 370upx;
+		padding-top: 30upx;
 		background-color: #FFFFFF;
 		margin: auto;
 	}
-	
 	.charts {
-		width: 600upx;
-		height: 430upx;
+		width: 690upx;
+		height: 370upx;
 		background-color: #FFFFFF;
 		margin: auto;
 	}
 	.preImg {
-		position: absolute;left: 40upx; width: 60upx;height: 60upx;
+		position: absolute;left: 40upx; width: 27upx;height: 45upx;
 	}
 	.nextImg {
-		position: absolute;right: 40upx; width: 60upx;height: 60upx;
+		position: absolute;right: 40upx; width: 27upx;height: 45upx;
 	}
 </style>

+ 19 - 11
pages/Charts/mainStatistics.vue

@@ -18,11 +18,11 @@
 				</view>
 				<view class="riTitle">
 					<view style="text-align:left;font-size:28upx;font-family:PingFang-SC-Medium">
-						<font style="color: #596D83;">今日收入总额:\t\t\t  </font>
+						<font class="fontLeft" style="color: #596D83;">今日收入总额:</font>
 						<font style="color: #ED341F;">  {{dayTotalMoney}}</font>
 					</view>
 					<view style="text-align:left;font-size:28upx;font-family:PingFang-SC-Medium">
-						<font style="color: #596D83;">今日销售数量:\t\t\t </font>
+						<font class="fontLeft" style="color: #596D83;">今日销售数量:</font>
 						<font style="color: #ED341F;">  {{dayTotalNum}}</font>
 					</view>
 				</view>
@@ -43,11 +43,11 @@
 				</view>
 				<view class="fourShell">
 					<view class="one">
-						<font style="color: #596D83;">本周收入总额:\t\t\t  </font>
+						<font class="fontLeft" style="color: #596D83;">本周收入总额:</font>
 						<font style="color: #ED341F;">  {{dayTotalMoney}}</font>
 					</view>
 					<view class="two">
-						<font style="color: #596D83;">本周销售数量:\t\t\t </font>
+						<font class="fontLeft" style="color: #596D83;">本周销售数量:</font>
 						<font style="color: #ED341F;">  {{dayTotalNum}}</font>
 					</view>
 				</view>
@@ -59,11 +59,11 @@
 				</view>
 				<view class="fourShell">
 					<view class="one">
-						<font style="color: #596D83;">本月收入总额:\t\t\t  </font>
+						<font class="fontLeft" style="color: #596D83;">本月收入总额:</font>
 						<font style="color: #ED341F;">  {{monthTotalMoney}}</font>
 					</view>
 					<view class="two">
-						<font style="color: #596D83;">本月销售数量:\t\t\t </font>
+						<font class="fontLeft" style="color: #596D83;">本月销售数量:</font>
 						<font style="color: #ED341F;">  {{monthTotalNum}}</font>
 					</view>
 				</view>
@@ -75,11 +75,11 @@
 				</view>
 				<view class="fourShell">
 					<view class="one">
-						<font style="color: #596D83;">本年收入总额:\t\t\t  </font>
+						<font class="fontLeft" style="color: #596D83;">本年收入总额:</font>
 						<font style="color: #ED341F;">  {{yearTotalMoney}}</font>
 					</view>
 					<view class="two">
-						<font style="color: #596D83;">本年销售数量:\t\t\t </font>
+						<font class="fontLeft" style="color: #596D83;">本年销售数量:</font>
 						<font style="color: #ED341F;">  {{yearTotalNum}}</font>
 					</view>
 				</view>
@@ -91,11 +91,11 @@
 				</view>
 				<view class="fourShell">
 					<view class="one">
-						<font style="color: #596D83;">投放机器数量:\t\t\t  </font>
+						<font class="fontLeft" style="color: #596D83;">投放机器数量:</font>
 						<font style="color: #ED341F;">  {{machineTotalNum}}</font>
 					</view>
 					<view class="two">
-						<font style="color: #596D83;">运营机器数量:\t\t\t </font>
+						<font class="fontLeft" style="color: #596D83;">运营机器数量:</font>
 						<font style="color: #ED341F;">  {{machineUseNum}}</font>
 					</view>
 				</view>
@@ -175,10 +175,10 @@
 		props: {
 			equipmentId: '',
 			adminId: '',
+			pname:'',
 		},
 		data() {
 			return {
-				pname:'',
 				machineTotalNum:0,
 				machineUseNum:0,
 				dayTotalMoney:0,
@@ -222,6 +222,11 @@
 		methods: {
 			...mapActions('chart', ['getStatistics','getMainStatistics','getMachineNum']),
 			async init(){
+				console.log('pname:{}',this.pname)
+				if(!this.pname){
+					console.log('loginUser:{}',this.loginUser)
+					this.pname=this.loginUser.name;
+				}
 				console.log("adminId:" + this.adminId)
 				console.log("equipmentId:" + this.equipmentId)
 				_self = this;
@@ -705,4 +710,7 @@
 	.nextImg {
 		position: absolute;right: 40upx; width: 27upx;height: 45upx;
 	}
+	.fontLeft{
+		margin-right: 20upx;
+	}
 </style>