浏览代码

修改报表

wangchao 3 年之前
父节点
当前提交
a90c81483d
共有 2 个文件被更改,包括 408 次插入192 次删除
  1. 0 1
      pages/grain_pulse/details.vue
  2. 408 191
      pages/user/report.vue

+ 0 - 1
pages/grain_pulse/details.vue

@@ -211,7 +211,6 @@
 						loginPhone: this.userInfo.phone
 					}).then(res => {
 						if (res.data.code == 200) {
-							debugger
 							uni.showToast({
 								title: '取消收藏',
 								icon: 'none',

+ 408 - 191
pages/user/report.vue

@@ -1,199 +1,85 @@
 <template>
-	<view>
-	
-	<web-view :src="url" class="map"></web-view>
-	<view class="charts-box">
-	  <qiun-data-charts
-	 @getIndex='getdata'
-	    type="ring"
-		:opts='ringoptions'
-	    :chartData="Ring"
-		background= "#24262D"
-	  />
-	  <qiun-data-charts
-	  @getIndex='getdata'
-	     type="ring"
-	  		:opts='ringoptions1'
-	     :chartData="Ring1"
-	  		background= "#24262D"
-	   />
-	  <qiun-data-charts
-	  @getIndex='getdata'
-	     type="column"
-	     :chartData="chartData"
-	     background="none"
-	   />
-	</view>	
+	<view class="content">
+		<view class="title">库点流向分布</view>
+		<iframe id="mainIframe" ref="mainIframe" name="mainIframe" :src="url" class="map"></iframe>
+		<view class="charts-box" v-for="(item,index) in chartlist" :key='index'>
+			<div class="bottom-tip" v-if='index==0||index==3'>统计单位:吨</div>
+			<div class="bottom-tip" v-if='index!=0&&index!=3' :class='index==2?"title-margin":""'>统计单位:元</div>
+			<view v-if="index==0" class="title">采购合同完成进度</view>
+			<qiun-data-charts type="ring" :opts='item.ringoptions' :chartData="item.Ring" background="#24262D" />
+			<view v-if="index==2" class="title">销售合同完成进度</view>
+		</view>
+		<view class="content2">
+			<view class="title">在途信息统计</view>
+			<view class="row">
+				<view class="item">
+					<view class="item-top">在途车辆</view>
+					<view class="item-bottom">
+						<view style="color: #50cad4;font-size: 50rpx;">{{carCount1}} </view>台
+					</view>
+				</view>
+				<view class="item">
+					<view class="item-top">装车车辆</view>
+					<view class="item-bottom">
+						<view style="color: rgb(255, 165, 35);font-size: 50rpx;">{{carCount2}}</view>台
+					</view>
+				</view>
+				<view class="item">
+					<view class="item-top">卸货车辆</view>
+					<view class="item-bottom">
+						<view style="color: rgb(36, 131, 255);font-size: 50rpx;">{{carCount3}}</view>台
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="content3">
+			<view class="title">粮食总储量</view>
+			<qiun-data-charts type="column" :chartData="chartData" :opts='ringoptions' background="none" />
+		</view>
+		<view class="content4">
+			<view class="title">库存成本</view>
+			<view class="row">
+				<view class="item">
+					<view class="item-top">总库存量</view>
+					<view class="item-bottom">
+						<view style="color: #50cad4;font-size: 50rpx;">{{inventoryCost}}</view>吨
+					</view>
+				</view>
+				<view class="item">
+					<view class="item-top">库存价值</view>
+					<view class="item-bottom">
+						<view style="color: rgb(255, 165, 35);font-size: 50rpx;">{{inventoryValue}}</view>元
+					</view>
+				</view>
+
+			</view>
+		</view>
 	</view>
-	
-	<!-- <web-view v-if="flag" :src="url"></web-view> -->
-	<!-- <iframe v-else :src="url" width="340" height="360" allowfullscreen allow="autoplay; fullscreen; microphone;"></iframe> -->
 </template>
 
 <script>
 	export default {
 		data() {
 			return {
+				chartlist: [],
+				carCount1: '',
+				carCount2: '',
+				carCount3: '',
+				inventoryCost: '',
+				inventoryValue: '',
+				ZChart: {},
 				// url:"https://datav.aliyuncs.com/share/235518097ffd673bc1eb05011b9a02b6",
 				url: 'http://192.168.1.116:8011',
 				flag: true,
-				chartData:{
-				 categories:['2016','2017','2018','2019','2020','2021'],
-				 series:[{
-				  name:'目标值',
-				  data:[35, 36, 31, 33, 13, 34]
-				 },{
-				  name:'完成量',
-				  data:[18, 27, 21, 24, 6, 28]
-				 }]
-				},
-				ringoptions:{
-					"type": "ring",
-					"canvasId": "",
-					"canvas2d": false,
-					"background": "#24262D",
-					"borderColor":'#24262D',
-					"animation": true,
-					"timing": "easeOut",
-					"duration": 1000,
-					"color": [
-						'#75d1f4', '#3a3b40'
-					],
-					"rotate": false,
-					"errorReload": true,
-					"fontSize": 13,
-					"fontColor": "#666666",
-					"enableScroll": false,
-					"touchMoveLimit": 60,
-					"enableMarkLine": false,
-					"dataLabel": true,
-					"dataPointShape": false,
-					"dataPointShapeType": "solid",
-					"tapLegend": true,
-					"legend": {
-						"show": true,
-						"position": "top",
-						"padding": 5,
-						"margin": 5,
-						"backgroundColor": "rgba(0,0,0,0)",
-						"borderColor": "rgba(0,0,0,0)",
-						"borderWidth": 0,
-						"fontSize": 13,
-						"fontColor": "#fff",
-						"lineHeight": 25,
-						"hiddenColor": "#CECECE",
-						"itemGap": 10
-					},
-					"title": {
-						"name": "总量合计",
-						"fontSize": 15,
-						"color": "#fff",
-					},
-					"subtitle": {
-						"name": "70%",
-						"fontSize": 25,
-						"color": "#fff",
-					},
-					"extra": {
-						"ring": {
-							"ringWidth": 20,
-							"centerColor": "#24262D",
-							"activeOpacity": 0.5,
-							"activeRadius": 10,
-							"offsetAngle": 0,
-							"customRadius": 0,
-							"labelWidth": 15,
-							"border": true,
-							"borderWidth": 3,
-							"borderColor": "#24262D",
-							"linearType": "none"
-						},
-					}
-				},
-				ringoptions1:{
-					"type": "ring",
-					"canvasId": "",
-					"canvas2d": false,
-					"background": "#24262D",
-					"borderColor":'#24262D',
-					"animation": true,
-					"timing": "easeOut",
-					"duration": 1000,
-					"color": [
-						'#247ef4', '#3a3b40'
-					],
-					"rotate": false,
-					"errorReload": true,
-					"fontSize": 13,
-					"fontColor": "#666666",
-					"enableScroll": false,
-					"touchMoveLimit": 60,
-					"enableMarkLine": false,
-					"dataLabel": true,
-					"dataPointShape": false,
-					"dataPointShapeType": "solid",
-					"tapLegend": true,
-					"legend": {
-						"show": true,
-						"position": "top",
-						"padding": 5,
-						"margin": 5,
-						"backgroundColor": "rgba(0,0,0,0)",
-						"borderColor": "rgba(0,0,0,0)",
-						"borderWidth": 0,
-						"fontSize": 13,
-						"fontColor": "#fff",
-						"lineHeight": 25,
-						"hiddenColor": "#CECECE",
-						"itemGap": 10
-					},
-					"title": {
-						"name": "总量合计",
-						"fontSize": 15,
-						"color": "#fff",
-					},
-					"subtitle": {
-						"name": "70%",
-						"fontSize": 25,
-						"color": "#fff",
-					},
-					"extra": {
-						"ring": {
-							"ringWidth": 20,
-							"centerColor": "#24262D",
-							"activeOpacity": 0.5,
-							"activeRadius": 10,
-							"offsetAngle": 0,
-							"customRadius": 0,
-							"labelWidth": 15,
-							"border": true,
-							"borderWidth": 3,
-							"borderColor": "#24262D",
-							"linearType": "none"
-						},
-					}
-				},
-				"Ring":{
-				"series":[{
-				"name":"已完成量",
-				"data":50
-				},{
-				"name":"未完成量",
-				"data":30
-				}]
-				},
-				"Ring1":{
-				"series":[{
-				"name":"已开票",
-				"data":50
-				},{
-				"name":"未开票",
-				"data":30
-				}]
-				}
+				chartData: {},
+				ringoptions: {},
 			}
 		},
 		onLoad: function(option) {
+			uni.showLoading({
+				title: "加载中",
+				mask: true
+			})
 			if (option.url) {
 				this.url = option.url;
 				uni.setNavigationBarTitle({
@@ -201,20 +87,351 @@
 				})
 				this.flag = false
 			}
+			this.init()
 		},
-		methods: {}
+		methods: {
+			init() {
+				this.$api.doRequest('get', '/biInfoController/selectBiInfo').then(res => {
+					console.log(res)
+					uni.hideLoading()
+					let _list = []
+					for (let i = 0; i < res.data.data.length; i++) {
+						let _obj = {}
+						let _color = []
+						let _title = ""
+						let _subtitle = ''
+						let _name = ''
+						let _count = ''
+						let _data = []
+						switch (i) {
+							case 0:
+								_color = ['#75d1f4', '#3a3b40'];
+								_title = '总量合计'
+								_data = [{
+									name: '已完成量',
+									data: Number(res.data.data[i].biViewInfoList[0].count)
+								}, {
+									name: '待完成量',
+									data: Number(res.data.data[i].biViewInfoList[1].count)
+								}]
+								break;
+							case 1:
+								_color = ['#247ef4', '#3a3b40'];
+								_title = '开票合计'
+								_data = [{
+									name: '已开票',
+									data: Number(res.data.data[i].biViewInfoList[0].count)
+								}, {
+									name: '待开票',
+									data: Number(res.data.data[i].biViewInfoList[1].count)
+								}]
+								break;
+							case 2:
+								_color = ['#f49f23', '#3a3b40'];
+								_title = '付款合计'
+								_data = [{
+									name: '已付款',
+									data: Number(res.data.data[i].biViewInfoList[0].count)
+								}, {
+									name: '待付款',
+									data: Number(res.data.data[i].biViewInfoList[1].count)
+								}]
+								break;
+							case 3:
+								_color = ['#75d1f4', '#3a3b40'];
+								_title = '总量合计'
+								_data = [{
+									name: '已完成量',
+									data: Number(res.data.data[i].biViewInfoList[0].count)
+								}, {
+									name: '待完成量',
+									data: Number(res.data.data[i].biViewInfoList[1].count)
+								}]
+								break;
+							case 4:
+								_color = ['#247ef4', '#3a3b40'];
+								_title = '开票合计'
+								_data = [{
+									name: '已开票',
+									data: Number(res.data.data[i].biViewInfoList[0].count)
+								}, {
+									name: '待开票',
+									data: Number(res.data.data[i].biViewInfoList[1].count)
+								}]
+								break;
+							case 5:
+								_color = ['#f49f23', '#3a3b40'];
+								_title = '付款合计'
+								_data = [{
+									name: '待付款',
+									data: Number(res.data.data[i].biViewInfoList[0].count)
+								}, {
+									name: '待完成量',
+									data: Number(res.data.data[i].biViewInfoList[1].count)
+								}]
+								break;
+						}
+
+						if (i < 6) {
+							_subtitle = Number(res.data.data[i].total)
+							_obj.ringoptions = {
+									"type": "ring",
+									"animation": true,
+									"timing": "easeOut",
+									"duration": 1000,
+									"color": _color,
+									"fontSize": 13,
+									"fontColor": "#666666",
+									"legend": {
+										"show": true,
+										"position": "top",
+										"padding": 5,
+										"margin": 5,
+										"backgroundColor": "rgba(0,0,0,0)",
+										"borderColor": "rgba(0,0,0,0)",
+										"fontSize": 13,
+										"fontColor": "#CECECE",
+										"hiddenColor": "#CECECE",
+									},
+									"title": {
+										"name": _title,
+										"fontSize": 15,
+										"color": "#fff",
+									},
+									"subtitle": {
+										"name": _subtitle,
+										"fontSize": 25,
+										"color": "#fff",
+									},
+									"extra": {
+										"ring": {
+											"ringWidth": 15,
+											"centerColor": "#24262D",
+											"activeOpacity": 0.5,
+											"activeRadius": 10,
+											"borderColor": "#24262D",
+											"linearType": "none"
+										},
+									}
+								},
+								_obj.Ring = {
+									"series": _data
+								}
+
+							_list.push(_obj)
+						} else if (i == 6) {
+							this.carCount1 = res.data.data[i].biViewInfoList[0].count
+							this.carCount2 = res.data.data[i].biViewInfoList[1].count
+							this.carCount3 = res.data.data[i].biViewInfoList[2].count
+						} else if (i == 7) {
+							this.inventoryCost = res.data.data[i].biViewInfoList[0].count
+							this.inventoryValue = res.data.data[i].biViewInfoList[1].count
+						} else if (i == 8) {
+
+							let _x = []
+							let _y = []
+							for (let k = 0; k < res.data.data[i].biViewInfoList.length; k++) {
+								_x.push(res.data.data[i].biViewInfoList[k].name)
+								_y.push(res.data.data[i].biViewInfoList[k].count)
+							}
+							this.chartData = {
+								categories: _x,
+								series: [{
+									"name": '储量',
+									"data": _y
+								}]
+							}
+							this.ringoptions = {
+								"type": "column",
+								"canvasId": "",
+								"canvas2d": false,
+								"background": "none",
+								"animation": true,
+								"timing": "easeOut",
+								"duration": 1000,
+								"color": [
+									"#1890FF",
+									"#91CB74",
+									"#FAC858",
+									"#EE6666",
+									"#73C0DE",
+									"#3CA272",
+									"#FC8452",
+									"#9A60B4",
+									"#ea7ccc"
+								],
+								"padding": [
+									15,
+									15,
+									0,
+									5
+								],
+								"rotate": false,
+								"errorReload": true,
+								"fontSize": 13,
+								"fontColor": "#666666",
+								"enableScroll": false,
+								"touchMoveLimit": 60,
+								"enableMarkLine": false,
+								"dataLabel": true,
+								"dataPointShape": true,
+								"dataPointShapeType": "solid",
+								"tapLegend": true,
+								"xAxis": {
+									"disabled": false,
+									"axisLine": true,
+									"axisLineColor": "#CCCCCC",
+							 	"calibration": false,
+									"fontColor": "#666666",
+									"fontSize": 13,
+									"itemCount": 5,
+									"boundaryGap": "center",
+									"disableGrid": true,
+									"gridColor": "#CCCCCC",
+									"gridType": "solid",
+									"dashLength": 4,
+									"gridEval": 1,
+									"scrollShow": false,
+									"scrollAlign": "left",
+									"scrollColor": "#A6A6A6",
+									"scrollBackgroundColor": "#EFEBEF",
+									"rotateLabel": true,
+								},
+								"yAxis": {
+									"disabled": false,
+									"disableGrid": false,
+									"splitNumber": 5,
+									"gridType": "solid",
+									"dashLength": 8,
+							  "gridColor": "#CCCCCC",
+									"padding": 10,
+									"showTitle": false,
+									"data": [{
+										"type": "value",
+										"position": "left",
+							  	"disabled": false,
+										"axisLine": false,
+										"axisLineColor": "#CCCCCC",
+										"calibration": false,
+										"fontColor": "#666666",
+										"fontSize": 13,
+										"textAlign": "right",
+										"titleFontSize": 13,
+										"titleFontColor": "#666666",
+									}]
+								},
+								"extra": {
+									"column": {
+										"type": "group",
+										"width": 30,
+										"seriesGap": 2,
+										"categoryGap": 3,
+										"barBorderCircle": false,
+							   "linearType": "none",
+										"linearOpacity": 1,
+										"colorStop": 0,
+										"meterBorder": 1,
+										"meterFillColor": "#FFFFFF",
+										"activeBgColor": "#000000",
+										"activeBgOpacity": 0.08,
+										"meterBorde": 1
+									},
+									"tooltip": {
+										"showBox": true,
+										"showArrow": true,
+										"showCategory": false,
+										"borderWidth": 0,
+										"borderRadius": 0,
+										"borderColor": "#000000",
+										"borderOpacity": 0.7,
+										"bgColor": "#000000",
+										"bgOpacity": 0.7,
+										"gridType": "solid",
+										"dashLength": 4,
+										"gridColor": "#CCCCCC",
+										"fontColor": "#FFFFFF",
+										"splitLine": true,
+										"horizentalLine": false,
+										"xAxisLabel": false,
+										"yAxisLabel": false,
+										"labelBgColor": "#FFFFFF",
+										"labelBgOpacity": 0.7,
+										"labelFontColor": "#666666"
+									}
+								}
+							}
+						} else if (i == 9) {
+							document.getElementById('mainIframe').contentWindow.postMessage(res.data.data[i], '*')
+
+						}
+					}
+					this.chartlist = _list
+
+				})
+			},
+			getdata(e) {
+				console.log(e)
+			}
+		}
 	}
 </script>
 
 
 
-<style>
-	/* .map {
-		position:relative;
-		height: 400px;
-	} */
-	.charts-box{
-		position:relative;
-		top:70vh;
+<style scoped lang="scss">
+	.map {
+		top: 90rpx;
+		height: 60vh;
+		width: 100%;
+		border: 0;
+	}
+
+	.title {
+		background: black;
+		color: white;
+		text-align: center;
+		font-size: 1.25rem;
+		padding: 0.625rem;
+	}
+
+	.content {
+		background: black;
+		padding-bottom: 100rpx;
+	}
+
+	.charts-box {
+		// background: black;
+		position: relative;
+		// top: 70vh;
+	}
+
+	.content2 .row,
+	.content4 .row {
+		display: flex;
+		justify-content: space-around;
+		background: #24262d;
+		padding: 40rpx 20rpx;
+
+		.item-top,
+		.item-bottom {
+			color: #d5d5d5;
+		}
+
+		.item-bottom {
+			display: flex;
+			align-items: center;
+		}
+	}
+
+	.bottom-tip {
+		position: absolute;
+		z-index: 11;
+		color: #8c8c8d;
+		right: 10px;
+		bottom: 10px;
+	}
+
+	.title-margin {
+		bottom: 120rpx;
 	}
 </style>