李天标 5 år sedan
förälder
incheckning
2bf171d22e
1 ändrade filer med 244 tillägg och 181 borttagningar
  1. 244 181
      pages/Charts/mainStatistics.vue

+ 244 - 181
pages/Charts/mainStatistics.vue

@@ -19,20 +19,20 @@
 				<view class="riTitle">
 					<view style="text-align:left;font-size:28upx;font-family:PingFang-SC-Medium">
 						<font class="fontLeft" style="color: #596D83;">今日收入总额:</font>
-						<font style="color: #ED341F;">  {{dayTotalMoney}}</font>
+						<font style="color: #ED341F;"> {{dayTotalMoney}}</font>
 					</view>
 					<view style="text-align:left;font-size:28upx;font-family:PingFang-SC-Medium">
 						<font class="fontLeft" style="color: #596D83;">今日销售数量:</font>
-						<font style="color: #ED341F;">  {{dayTotalNum}}</font>
+						<font style="color: #ED341F;"> {{dayTotalNum}}</font>
 					</view>
 				</view>
 			</view>
 			<view class="riqi">
 				<view style="text-align:right" class="tody">
-					<font style="color: #596D83;">2019年10月7日</font>
+					<font style="color: #596D83;">{{today}}</font>
 				</view>
-				<view  style="text-align:right" class="xingqi">
-					<font style="color: #596D83;">星期一</font>
+				<view style="text-align:right" class="xingqi">
+					<font style="color: #596D83;">{{week}}</font>
 				</view>
 			</view>
 		</view>
@@ -44,59 +44,59 @@
 				<view class="fourShell">
 					<view class="one">
 						<font class="fontLeft" style="color: #596D83;">本周收入总额:</font>
-						<font style="color: #ED341F;">  {{dayTotalMoney}}</font>
+						<font style="color: #ED341F;"> {{dayTotalMoney}}</font>
 					</view>
 					<view class="two">
 						<font class="fontLeft" style="color: #596D83;">本周销售数量:</font>
-						<font style="color: #ED341F;">  {{dayTotalNum}}</font>
+						<font style="color: #ED341F;"> {{dayTotalNum}}</font>
 					</view>
 				</view>
 			</view>
-			
+
 			<view class="four">
 				<view class="fourImg">
-					<image style="width: 54upx;height: 54upx;padding-top: 20upx;"  src="../../static/img/yue.png" mode=""></image>
+					<image style="width: 54upx;height: 54upx;padding-top: 20upx;" src="../../static/img/yue.png" mode=""></image>
 				</view>
 				<view class="fourShell">
 					<view class="one">
 						<font class="fontLeft" style="color: #596D83;">本月收入总额:</font>
-						<font style="color: #ED341F;">  {{monthTotalMoney}}</font>
+						<font style="color: #ED341F;"> {{monthTotalMoney}}</font>
 					</view>
 					<view class="two">
 						<font class="fontLeft" style="color: #596D83;">本月销售数量:</font>
-						<font style="color: #ED341F;">  {{monthTotalNum}}</font>
+						<font style="color: #ED341F;"> {{monthTotalNum}}</font>
 					</view>
 				</view>
 			</view>
-			
+
 			<view class="four">
 				<view class="fourImg">
-					<image style="width: 54upx;height: 54upx;padding-top: 20upx;"  src="../../static/img/nian.png" mode=""></image>
+					<image style="width: 54upx;height: 54upx;padding-top: 20upx;" src="../../static/img/nian.png" mode=""></image>
 				</view>
 				<view class="fourShell">
 					<view class="one">
 						<font class="fontLeft" style="color: #596D83;">本年收入总额:</font>
-						<font style="color: #ED341F;">  {{yearTotalMoney}}</font>
+						<font style="color: #ED341F;"> {{yearTotalMoney}}</font>
 					</view>
 					<view class="two">
 						<font class="fontLeft" style="color: #596D83;">本年销售数量:</font>
-						<font style="color: #ED341F;">  {{yearTotalNum}}</font>
+						<font style="color: #ED341F;"> {{yearTotalNum}}</font>
 					</view>
 				</view>
 			</view>
-			
+
 			<view class="four">
 				<view class="fourImg">
-					<image style="width: 54upx;height: 54upx;padding-top: 20upx;"  src="../../static/img/zong.png" mode=""></image>
+					<image style="width: 54upx;height: 54upx;padding-top: 20upx;" src="../../static/img/zong.png" mode=""></image>
 				</view>
 				<view class="fourShell">
 					<view class="one">
 						<font class="fontLeft" style="color: #596D83;">投放机器数量:</font>
-						<font style="color: #ED341F;">  {{machineTotalNum}}</font>
+						<font style="color: #ED341F;"> {{machineTotalNum}}</font>
 					</view>
 					<view class="two">
 						<font class="fontLeft" style="color: #596D83;">运营机器数量:</font>
-						<font style="color: #ED341F;">  {{machineUseNum}}</font>
+						<font style="color: #ED341F;"> {{machineUseNum}}</font>
 					</view>
 				</view>
 			</view>
@@ -111,8 +111,8 @@
 				</view>
 			</view>
 			<view class="qiun-charts" style="background-color: #FFFFFF;">
-				<canvas canvas-id="canvaColumn1" id="canvaColumn1" class="charts" disable-scroll=true @touchstart="touchLine1" @touchmove="moveLine1"
-				 @touchend="touchEndLine1" style="background-color: #FFFFFF;"></canvas>
+				<canvas canvas-id="canvaColumn1" id="canvaColumn1" class="charts" disable-scroll=true @touchstart="touchLine1"
+				 @touchmove="moveLine1" @touchend="touchEndLine1" style="background-color: #FFFFFF;"></canvas>
 			</view>
 		</view>
 		<view class="qiun-columns">
@@ -125,8 +125,8 @@
 				</view>
 			</view>
 			<view class="qiun-charts" style="background-color: #FFFFFF;">
-				<canvas canvas-id="canvaColumn2" id="canvaColumn2" class="charts" disable-scroll=true @touchstart="touchLine2" @touchmove="moveLine2"
-				 @touchend="touchEndLine2" style="background-color: #FFFFFF;"></canvas>
+				<canvas canvas-id="canvaColumn2" id="canvaColumn2" class="charts" disable-scroll=true @touchstart="touchLine2"
+				 @touchmove="moveLine2" @touchend="touchEndLine2" style="background-color: #FFFFFF;"></canvas>
 			</view>
 		</view>
 		<view class="qiun-columns">
@@ -139,8 +139,8 @@
 				</view>
 			</view>
 			<view class="qiun-charts" style="background-color: #FFFFFF;">
-				<canvas canvas-id="canvaColumn3" id="canvaColumn3" class="charts" disable-scroll=true @touchstart="touchLine3" @touchmove="moveLine3"
-				 @touchend="touchEndLine3" style="background-color: #FFFFFF;"></canvas>
+				<canvas canvas-id="canvaColumn3" id="canvaColumn3" class="charts" disable-scroll=true @touchstart="touchLine3"
+				 @touchmove="moveLine3" @touchend="touchEndLine3" style="background-color: #FFFFFF;"></canvas>
 			</view>
 		</view>
 		<view class="qiun-columns">
@@ -153,42 +153,48 @@
 				</view>
 			</view>
 			<view class="qiun-charts" style="background-color: #FFFFFF;">
-				<canvas canvas-id="canvaColumn4" id="canvaColumn4" class="charts" disable-scroll=true @touchstart="touchLine4" @touchmove="moveLine4"
-				 @touchend="touchEndLine4" style="background-color: #FFFFFF;"></canvas>
+				<canvas canvas-id="canvaColumn4" id="canvaColumn4" class="charts" disable-scroll=true @touchstart="touchLine4"
+				 @touchmove="moveLine4" @touchend="touchEndLine4" style="background-color: #FFFFFF;"></canvas>
 			</view>
 		</view>
 	</view>
 </template>
 
 <script>
-	import { mapState, mapActions, mapMutations } from 'vuex';
+	import {
+		mapState,
+		mapActions,
+		mapMutations
+	} from 'vuex';
 	import uCharts from '@/components/u-charts/u-charts.js';
-	import {dateUtils} from '@/common/util.js';
-	
+	import {
+		dateUtils
+	} from '@/common/util.js';
+
 	var _self;
-	var canvaColumn1=null;
-	var canvaColumn2=null;
-	var canvaColumn3=null;
-	var canvaColumn4=null;
+	var canvaColumn1 = null;
+	var canvaColumn2 = null;
+	var canvaColumn3 = null;
+	var canvaColumn4 = null;
 	export default {
 		name: 'mainStatistics',
 		props: {
 			equipmentId: '',
 			adminId: '',
-			pname:'',
+			pname: '',
 		},
 		data() {
 			return {
-				machineTotalNum:0,
-				machineUseNum:0,
-				dayTotalMoney:0,
-				dayTotalNum:0,
-				weekTotalMoney:0,
-				weekTotalNum:0,
-				monthTotalMoney:0,
-				monthTotalNum:0,
-				yearTotalMoney:0,
-				yearTotalNum:0,
+				machineTotalNum: 0,
+				machineUseNum: 0,
+				dayTotalMoney: 0,
+				dayTotalNum: 0,
+				weekTotalMoney: 0,
+				weekTotalNum: 0,
+				monthTotalMoney: 0,
+				monthTotalNum: 0,
+				yearTotalMoney: 0,
+				yearTotalNum: 0,
 				cWidth: '',
 				cHeight: '',
 				pixelRatio: 1,
@@ -199,6 +205,8 @@
 				endDate3: '',
 				startDate4: '',
 				endDate4: '',
+				today:'',
+				week:''
 				// pname:''
 			}
 		},
@@ -212,22 +220,22 @@
 		onShow() {
 			var test = uni.getStorageSync('test');
 			//判断是不是初次登陆
-			if(test == 2){
+			if (test == 2) {
 				this.init();
 			}
+			this.day();
 		},
 		mounted() {
 			console.log("mounted");
 			this.init();
 		},
 		methods: {
-			...mapActions('chart', ['getStatistics','getMainStatistics','getMachineNum']),
-			async init(){
-				console.log('pname:{}',this.pname);
-				// this.pname=uni.getStorageSync("name");
-				if(!this.pname){
-					console.log('loginUser:{}',this.loginUser)
-					this.pname=this.loginUser.name;
+			...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)
@@ -237,20 +245,29 @@
 				this.cHeight = uni.upx2px(370);
 
 				await this.getMainStatisticsData();
-				
-				await this.initDateRang(new Date(),'day');
-				await this.initDateRang(new Date(),'week');
-				await this.initDateRang(new Date(),'month');
-				await this.initDateRang(new Date(),'year');
-				
+
+				await this.initDateRang(new Date(), 'day');
+				await this.initDateRang(new Date(), 'week');
+				await this.initDateRang(new Date(), 'month');
+				await this.initDateRang(new Date(), 'year');
+
 				//初次登陆跳转后,把test变成2
 				uni.setStorageSync('test', '2');
-				
+
+			},
+			day(){
+				var date = new Date();
+				var Y = date.getFullYear() + '年';
+				var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '月';
+				var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + '日';
+				var today = Y+M+D;
+				this.today = today;
+				var str= '星期'+'日一二三四五六'.charAt(date.getDay());
+				this.week = str;
 			},
-		
-			initDateRang(day,chartType) {
+			initDateRang(day, chartType) {
 				const daystr = dateUtils.formateDate(day, 'yyyy/MM/dd');
-				if(chartType === 'day'){
+				if (chartType === 'day') {
 					this.startDate1 = dateUtils.formateDate(day, 'yyyy/MM/dd');
 				}
 				if (chartType === 'week') {
@@ -265,7 +282,7 @@
 					this.startDate4 = dateUtils.formateDate(dateUtils.getCurrentYearFirstDate(day), 'yyyy/MM/dd');
 					this.endDate4 = dateUtils.formateDate(dateUtils.getCurrentYearLastDate(day), 'yyyy/MM/dd');
 				}
-				
+
 				return this.getStatisticsData(chartType);
 			},
 			/**上一个 */
@@ -275,7 +292,7 @@
 					day = new Date(this.startDate1);
 					day.setDate(day.getDate() - 1);
 				}
-				if(chartType === 'week'){ // 周
+				if (chartType === 'week') { // 周
 					day = new Date(this.startDate2);
 					day.setDate(day.getDate() - 7);
 				}
@@ -287,7 +304,7 @@
 					day = new Date(this.startDate4);
 					day.setFullYear(day.getFullYear() - 1);
 				}
-				this.initDateRang(day,chartType);				
+				this.initDateRang(day, chartType);
 			},
 			/**下一个 */
 			next(chartType) {
@@ -296,7 +313,7 @@
 					day = new Date(this.startDate1);
 					day.setDate(day.getDate() + 1);
 				}
-				if(chartType === 'week'){ // 周
+				if (chartType === 'week') { // 周
 					day = new Date(this.startDate2);
 					day.setDate(day.getDate() + 7);
 				}
@@ -308,73 +325,95 @@
 					day = new Date(this.startDate4);
 					day.setFullYear(day.getFullYear() + 1);
 				}
-				
-				this.initDateRang(day,chartType);
+
+				this.initDateRang(day, chartType);
 			},
 			getStatisticsData(chartType) {
 				const param = {
 					'chartType': chartType
 				};
-				if(chartType=='day'){
+				if (chartType == 'day') {
 					param['startDate'] = this.startDate1;
 					param['endDate'] = this.startDate1;
 				}
-				if(chartType=='week'){
+				if (chartType == 'week') {
 					param['startDate'] = this.startDate2;
 					param['endDate'] = this.endDate2;
 				}
-				if(chartType=='month'){
+				if (chartType == 'month') {
 					param['startDate'] = this.startDate3;
 					param['endDate'] = this.endDate3;
 				}
-				if(chartType=='year'){
+				if (chartType == 'year') {
 					param['startDate'] = this.startDate4;
 					param['endDate'] = this.endDate4;
 				}
-				if(this.adminId){ // 子组件,则拿传过来的参
+				if (this.adminId) { // 子组件,则拿传过来的参
 					param['adminId'] = this.adminId;
-				}else if ('admin' !== this.loginUser['username']) { //否则为主页,拿登录用户
+				} else if ('admin' !== this.loginUser['username']) { //否则为主页,拿登录用户
 					param['adminId'] = this.loginUser['id'];
 				}
 				if (this.equipmentId) {
 					param['equipmentId'] = this.equipmentId;
 				}
-				
+
 				return this.getStatistics(param)
 					.then(data => {
-							uni.stopPullDownRefresh();
-							if(param['chartType']=='day'){
-								canvaColumn1 = this.initChart('canvaColumn1',data);
-							}
-							if(param['chartType']=='week'){
-								canvaColumn2 = this.initChart('canvaColumn2',data);
-							}
-							if(param['chartType']=='month'){
-								canvaColumn3 = this.initChart('canvaColumn3',data);
-							}
-							if(param['chartType']=='year'){
-								canvaColumn4 = this.initChart('canvaColumn4',data);
-							}
-							
+						uni.stopPullDownRefresh();
+						if (param['chartType'] == 'day') {
+							canvaColumn1 = this.initChart('canvaColumn1', data);
 						}
-					, _ => {
-							uni.stopPullDownRefresh();
-							if(param['chartType']=='day'){
-								canvaColumn1 = this.initChart('canvaColumn1',{categories:['暂无数据'],series:[{name: '销售个数',data:[0]}]});
-							}
-							if(param['chartType']=='week'){
-								canvaColumn2 = this.initChart('canvaColumn2',{categories:['暂无数据'],series:[{name: '销售个数',data:[0]}]});
-							}
-							if(param['chartType']=='month'){
-								canvaColumn3 = this.initChart('canvaColumn3',{categories:['暂无数据'],series:[{name: '销售个数',data:[0]}]});
-							}
-							if(param['chartType']=='year'){
-								canvaColumn4 = this.initChart('canvaColumn4',{categories:['暂无数据'],series:[{name: '销售个数',data:[0]}]});
-							}
+						if (param['chartType'] == 'week') {
+							canvaColumn2 = this.initChart('canvaColumn2', data);
+						}
+						if (param['chartType'] == 'month') {
+							canvaColumn3 = this.initChart('canvaColumn3', data);
+						}
+						if (param['chartType'] == 'year') {
+							canvaColumn4 = this.initChart('canvaColumn4', data);
+						}
+
+					}, _ => {
+						uni.stopPullDownRefresh();
+						if (param['chartType'] == 'day') {
+							canvaColumn1 = this.initChart('canvaColumn1', {
+								categories: ['暂无数据'],
+								series: [{
+									name: '销售个数',
+									data: [0]
+								}]
+							});
+						}
+						if (param['chartType'] == 'week') {
+							canvaColumn2 = this.initChart('canvaColumn2', {
+								categories: ['暂无数据'],
+								series: [{
+									name: '销售个数',
+									data: [0]
+								}]
+							});
+						}
+						if (param['chartType'] == 'month') {
+							canvaColumn3 = this.initChart('canvaColumn3', {
+								categories: ['暂无数据'],
+								series: [{
+									name: '销售个数',
+									data: [0]
+								}]
+							});
+						}
+						if (param['chartType'] == 'year') {
+							canvaColumn4 = this.initChart('canvaColumn4', {
+								categories: ['暂无数据'],
+								series: [{
+									name: '销售个数',
+									data: [0]
+								}]
+							});
 						}
-					);
+					});
 			},
-			initChart(canvasId, chartData){
+			initChart(canvasId, chartData) {
 				return new uCharts({
 					$this: _self,
 					canvasId: canvasId,
@@ -382,7 +421,7 @@
 					type: 'column',
 					legend: true,
 					fontSize: 11,
-					background: '#FFFFFF',//y轴颜色
+					background: '#FFFFFF', //y轴颜色
 					pixelRatio: 1,
 					animation: true,
 					categories: chartData.categories,
@@ -411,70 +450,69 @@
 					}
 				});
 			},
-			getMainStatisticsData(){
+			getMainStatisticsData() {
 				const param = {};
-				if(this.adminId){ // 子组件,则拿传过来的参
+				if (this.adminId) { // 子组件,则拿传过来的参
 					param['adminId'] = this.adminId;
-				}else if ('admin' !== this.loginUser['username']) { //否则为主页,拿登录用户
+				} else if ('admin' !== this.loginUser['username']) { //否则为主页,拿登录用户
 					param['adminId'] = this.loginUser['id'];
 				}
 				if (this.equipmentId) {
 					param['equipmentId'] = this.equipmentId;
 				}
-				console.log('getMainStatisticsData:{}',param);
+				console.log('getMainStatisticsData:{}', param);
 				var adminId = param.adminId;
 				var equipmentId = this.equipmentId;
 				var serverurl = this.serverurl;
 				uni.request({
-				    url: serverurl+'/TEquipment/getMachineNum', 
-					data:{
-						"adminId":adminId,
-						"equipmentId":equipmentId
+					url: serverurl + '/TEquipment/getMachineNum',
+					data: {
+						"adminId": adminId,
+						"equipmentId": equipmentId
 					},
-				    method:"POST",
-				    success: (res) => {
-							var list = res.data.data;
-							this.machineTotalNum = list[0];
-							this.machineUseNum = list[1];
-				    }
+					method: "POST",
+					success: (res) => {
+						var list = res.data.data;
+						this.machineTotalNum = list[0];
+						this.machineUseNum = list[1];
+					}
 				});
 				return this.getMainStatistics(param)
 					.then(data => {
 						for (let bean of data) {
-							if(bean['categorie']==='day'){
-								this.dayTotalMoney=bean['salePrice'];
-								this.dayTotalNum=bean['saleNum'];
+							if (bean['categorie'] === 'day') {
+								this.dayTotalMoney = bean['salePrice'];
+								this.dayTotalNum = bean['saleNum'];
 							}
-							if(bean['categorie']==='week'){
-								this.weekTotalMoney=bean['salePrice'];
-								this.weekTotalNum=bean['saleNum'];
+							if (bean['categorie'] === 'week') {
+								this.weekTotalMoney = bean['salePrice'];
+								this.weekTotalNum = bean['saleNum'];
 							}
-							if(bean['categorie']==='month'){
-								this.monthTotalMoney=bean['salePrice'];
-								this.monthTotalNum=bean['saleNum'];
+							if (bean['categorie'] === 'month') {
+								this.monthTotalMoney = bean['salePrice'];
+								this.monthTotalNum = bean['saleNum'];
 							}
-							if(bean['categorie']==='year'){
-								this.yearTotalMoney=bean['salePrice'];
-								this.yearTotalNum=bean['saleNum'];
+							if (bean['categorie'] === 'year') {
+								this.yearTotalMoney = bean['salePrice'];
+								this.yearTotalNum = bean['saleNum'];
 							}
 						}
 						uni.stopPullDownRefresh();
-					}
-					, _ => void uni.stopPullDownRefresh());
+					}, _ => void uni.stopPullDownRefresh());
 			},
 
 			touchLine1(e) {
-				if(canvaColumn1){
+				if (canvaColumn1) {
 					canvaColumn1.scrollStart(e);
 				}
 			},
 			moveLine1(e) {
-				if(canvaColumn1){
+				if (canvaColumn1) {
 					canvaColumn1.scroll(e);
 				}
 			},
 			touchEndLine1(e) {
-				if(canvaColumn1){
+				if (canvaColumn1) {
 					canvaColumn1.scrollEnd(e);
 					//下面是toolTip事件,如果滚动后不需要显示,可不填写
 					canvaColumn1.showToolTip(e, {
@@ -485,17 +523,17 @@
 				}
 			},
 			touchLine2(e) {
-				if(canvaColumn2){
+				if (canvaColumn2) {
 					canvaColumn2.scrollStart(e);
 				}
 			},
 			moveLine2(e) {
-				if(canvaColumn2){
+				if (canvaColumn2) {
 					canvaColumn2.scroll(e);
 				}
 			},
 			touchEndLine2(e) {
-				if(canvaColumn2){
+				if (canvaColumn2) {
 					canvaColumn2.scrollEnd(e);
 					//下面是toolTip事件,如果滚动后不需要显示,可不填写
 					canvaColumn2.showToolTip(e, {
@@ -506,17 +544,17 @@
 				}
 			},
 			touchLine3(e) {
-				if(canvaColumn3){
+				if (canvaColumn3) {
 					canvaColumn3.scrollStart(e);
 				}
 			},
 			moveLine3(e) {
-				if(canvaColumn3){
+				if (canvaColumn3) {
 					canvaColumn3.scroll(e);
 				}
 			},
 			touchEndLine3(e) {
-				if(canvaColumn3){
+				if (canvaColumn3) {
 					canvaColumn3.scrollEnd(e);
 					//下面是toolTip事件,如果滚动后不需要显示,可不填写
 					canvaColumn3.showToolTip(e, {
@@ -527,17 +565,17 @@
 				}
 			},
 			touchLine4(e) {
-				if(canvaColumn4){
+				if (canvaColumn4) {
 					canvaColumn4.scrollStart(e);
 				}
 			},
 			moveLine4(e) {
-				if(canvaColumn4){
+				if (canvaColumn4) {
 					canvaColumn4.scroll(e);
 				}
 			},
 			touchEndLine4(e) {
-				if(canvaColumn4){
+				if (canvaColumn4) {
 					canvaColumn4.scrollEnd(e);
 					//下面是toolTip事件,如果滚动后不需要显示,可不填写
 					canvaColumn4.showToolTip(e, {
@@ -553,126 +591,140 @@
 <style>
 	page {
 		/* background: #F2F2F2; */
-		background:#FFFFFF;
+		background: #FFFFFF;
 		width: 750upx;
 		overflow-x: hidden;
 	}
-	.head{
+
+	.head {
 		display: flex;
 		flex-direction: row;
-		background:#206DC3;
+		background: #206DC3;
 		width: 750upx;
 		height: 180upx;
 	}
-	.company{
+
+	.company {
 		width: 48%;
-		text-align:right;
+		text-align: right;
 	}
-	.pname{
+
+	.pname {
 		display: flex;
 		flex-direction: row;
 		width: 40%;
 	}
-	.userFlagimg{
+
+	.userFlagimg {
 		padding-left: 10upx;
 		padding-top: 10upx;
 		width: 26upx;
 		height: 28upx;
 	}
-	.wenzi{
+
+	.wenzi {
 		padding-right: 0upx;
 		/* text-align:right; */
 		white-space: nowrap;
 		overflow: hidden;
 		/* text-overflow: ellipsis; */
 	}
-	.ri{
+
+	.ri {
 		width: 690upx;
 		height: 180upx;
-		background:#FFFFFF;
+		background: #FFFFFF;
 		border-radius: 15upx;
 		/* 上移 */
 		transform: translateY(-90upx);
-		text-align:center;
+		text-align: center;
 		margin: auto;
 		display: flex;
 		flex-direction: row;
 		/* 阴影 */
-		box-shadow:0upx -1upx   20upx #D3D3D3;
+		box-shadow: 0upx -1upx 20upx #D3D3D3;
 		/* box-shadow:0px 0px  10px 5px #aaa; */
 	}
-	.riShell{
+
+	.riShell {
 		display: flex;
 		flex-direction: row;
 		margin: auto;
 	}
-	.riTitle{
+
+	.riTitle {
 		display: flex;
 		flex-direction: column;
 		margin: auto;
 	}
-	.riqi{
+
+	.riqi {
 		display: flex;
 		flex-direction: column;
 		margin: auto;
 	}
-	.fourTitle{
+
+	.fourTitle {
 		width: 690upx;
 		height: 294upx;
 		display: flex;
 		flex-direction: row;
-		flex-wrap:wrap;
-		background:#FFFFFF;
-		box-shadow:0upx 0upx   20upx #D3D3D3;
+		flex-wrap: wrap;
+		background: #FFFFFF;
+		box-shadow: 0upx 0upx 20upx #D3D3D3;
 		margin: auto;
 		border-radius: 15upx;
 		transform: translateY(-60upx);
-		}
-	.four{
+	}
+
+	.four {
 		display: flex;
 		flex-direction: row;
 		margin: auto;
 		width: 48%;
 	}
-	.fourImg{
+
+	.fourImg {
 		width: 54upx;
 		height: 54upx;
 	}
+
 	.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: 0upx;
 		height: 200upx;
 	}
-	
+
 	.qiun-bg-white {
 		background: #FFFFFF;
 	}
-	
+
 	.qiun-title-bar {
 		width: 100%;
 		/* padding: 10upx 2%; */
 		flex-wrap: nowrap;
 		border-radius: 15upx;
 	}
+
 	.qiun-title-dot-light {
 		border-left: 30upx solid #0ea391;
 		padding-top: 20upx;
@@ -685,13 +737,15 @@
 		font-size: 32upx;
 		color: #363D44;
 	}
-	.shijian{
+
+	.shijian {
 		padding-top: 30upx;
 		height: 80upx;
 		width: 690upx;
 		margin: auto;
-		box-shadow:0upx 0upx 10upx #D3D3D3;
+		box-shadow: 0upx 0upx 10upx #D3D3D3;
 	}
+
 	.qiun-charts {
 		width: 690upx;
 		height: 370upx;
@@ -699,20 +753,29 @@
 		background-color: #FFFFFF;
 		margin: auto;
 	}
-	
+
 	.charts {
 		width: 690upx;
 		height: 370upx;
 		background-color: #FFFFFF;
 		margin: auto;
 	}
+
 	.preImg {
-		position: absolute;left: 40upx; width: 27upx;height: 45upx;
+		position: absolute;
+		left: 40upx;
+		width: 27upx;
+		height: 45upx;
 	}
+
 	.nextImg {
-		position: absolute;right: 40upx; width: 27upx;height: 45upx;
+		position: absolute;
+		right: 40upx;
+		width: 27upx;
+		height: 45upx;
 	}
-	.fontLeft{
+
+	.fontLeft {
 		margin-right: 20upx;
 	}
 </style>