|
@@ -10,7 +10,7 @@
|
|
|
<img src="../../../public/img/8b2c7255e9b19c71d68b33a08f20f74.png" alt="">
|
|
|
|
|
|
</div>
|
|
|
- <div class="right">
|
|
|
+ <div class="right">
|
|
|
<div class="top">
|
|
|
{{ nowDate }}
|
|
|
</div>
|
|
@@ -54,15 +54,15 @@
|
|
|
<div class="left-card">
|
|
|
<div class="item">
|
|
|
<p>在途车辆</p>
|
|
|
- <p><span class="number">76</span><span class="number-text">台</span></p>
|
|
|
+ <p><span class="number">{{carCount1}}</span><span class="number-text">台</span></p>
|
|
|
</div>
|
|
|
<div class="item">
|
|
|
<p>装货车辆</p>
|
|
|
- <p><span class="number" style="color:#ffa523;">86</span><span class="number-text">台</span></p>
|
|
|
+ <p><span class="number" style="color:#ffa523">{{carCount2}}</span><span class="number-text">台</span></p>
|
|
|
</div>
|
|
|
<div class="item">
|
|
|
<p>卸货车辆</p>
|
|
|
- <p><span class="number" style="color: #2483ff;">16</span><span class="number-text">台</span></p>
|
|
|
+ <p><span class="number" style="color:#2483ff">{{carCount3}}</span><span class="number-text">台</span></p>
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-col>
|
|
@@ -83,14 +83,14 @@
|
|
|
<div class="left">
|
|
|
<img src="../../../public/img/1637204557176-s4AMbBA8.png" alt="">
|
|
|
<span>总库存量</span>
|
|
|
- <span class="content3-number blue">27631</span>
|
|
|
+ <span class="content3-number blue">{{inventoryCost}}</span>
|
|
|
<span style="margin-top: 10px;">吨</span>
|
|
|
</div>
|
|
|
<div class="right">
|
|
|
<img src="../../../public/img/1637204768818-70JRjz0H.png" alt="">
|
|
|
<span>库存价值</span>
|
|
|
- <span class="content3-number yellow">37745671</span>
|
|
|
- <span style="margin-top: 10px;">吨</span>
|
|
|
+ <span class="content3-number yellow">{{inventoryValue}}</span>
|
|
|
+ <span style="margin-top: 10px;">元</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-row>
|
|
@@ -160,7 +160,7 @@
|
|
|
noticeNumber,
|
|
|
queryCircularManagementReceiveList,
|
|
|
getStaffHomeShowList,
|
|
|
- getChartsData
|
|
|
+ gChartsData
|
|
|
} from '@/model/home/index'
|
|
|
import {
|
|
|
getUserVesselList,
|
|
@@ -211,6 +211,12 @@
|
|
|
|
|
|
data() {
|
|
|
return {
|
|
|
+ totalReserves:'',
|
|
|
+ inventoryCost:'',
|
|
|
+ inventoryValue:'',
|
|
|
+ carCount1:'',
|
|
|
+ carCount2:'',
|
|
|
+ carCount3:'',
|
|
|
chartsData: [],
|
|
|
nowDate: null, //存放年月日变量
|
|
|
nowTime: null, //存放时分秒变量
|
|
@@ -322,9 +328,9 @@
|
|
|
//获取快捷路口列表
|
|
|
this.getRouteList()
|
|
|
// this.checkUserInfoDialog()
|
|
|
- {
|
|
|
+ // {
|
|
|
this.timer = setInterval(this.getTime, 1000);
|
|
|
- }
|
|
|
+ // }
|
|
|
},
|
|
|
beforeDestroy() {
|
|
|
clearInterval(this.timer);
|
|
@@ -351,9 +357,15 @@
|
|
|
// }, 2000);
|
|
|
//获取新闻列表
|
|
|
// this.getNewList()
|
|
|
- getChartsData().toPromise().then(res => {
|
|
|
+ gChartsData().toPromise().then(res => {
|
|
|
console.log(res)
|
|
|
this.chartsData = res
|
|
|
+ this.carCount1 = res[6].biViewInfoList[0].count
|
|
|
+ this.carCount2 = res[6].biViewInfoList[1].count
|
|
|
+ this.carCount3 = res[6].biViewInfoList[2].count
|
|
|
+ this.inventoryCost = res[7].biViewInfoList[0].count
|
|
|
+ this.inventoryValue = res[7].biViewInfoList[1].count
|
|
|
+ this.totalReserves = res[8].biViewInfoList
|
|
|
this.initCharts()
|
|
|
})
|
|
|
// if (this.vesselBankFlag !== 'V') {
|
|
@@ -604,48 +616,18 @@
|
|
|
app.dialogVisible = true
|
|
|
})
|
|
|
}
|
|
|
-
|
|
|
+ debugger
|
|
|
+ console.log(this.totalReserves)
|
|
|
+ let _x = []
|
|
|
+ let _y = []
|
|
|
+ for(let i = 0;i<this.totalReserves.length;i++){
|
|
|
+ _x.push(this.totalReserves[i].name)
|
|
|
+ _y.push(this.totalReserves[i].count)
|
|
|
+ }
|
|
|
+
|
|
|
// 柱状图
|
|
|
let myChart7 = app.$echarts.init(this.$refs.myEchart7);
|
|
|
var zoption = {
|
|
|
- // ---- 标题 -----
|
|
|
- // title: {
|
|
|
- // text: '',//主标题
|
|
|
- // textStyle: {
|
|
|
- // color: 'red'
|
|
|
- // },
|
|
|
- // subtext: '',//副标题
|
|
|
- // subtextStyle: {
|
|
|
- // color: 'blue'
|
|
|
- // },
|
|
|
- // padding: [0, 0, 10, 100] // 位置
|
|
|
- // },
|
|
|
- // ---- legend ----
|
|
|
- // legend: {
|
|
|
- // type: 'plain', // 图列类型,默认为 'plain'
|
|
|
- // top: '1%', // 图列相对容器的位置 top\bottom\left\right
|
|
|
- // selected: {
|
|
|
- // // '销量': true // 图列选择,图形加载出来会显示选择的图列,默认为true
|
|
|
- // },
|
|
|
- // textStyle: { // 图列内容样式
|
|
|
- // color: '#fff', // 字体颜色
|
|
|
- // backgroundColor: 'black' // 字体背景色
|
|
|
- // },
|
|
|
- // tooltip: { // 图列提示框,默认不显示
|
|
|
- // show: true,
|
|
|
- // color: '#666'
|
|
|
- // },
|
|
|
- // data: [ // 图列内容
|
|
|
- // {
|
|
|
- // name: '', //上方标题内容
|
|
|
- // icon: 'circle',
|
|
|
- // textStyle: {
|
|
|
- // color: '#666', // 单独设置某一个图列的颜色
|
|
|
- // backgroundColor: '#fff' // 单独设置某一个图列的字体背景色
|
|
|
- // }
|
|
|
- // }
|
|
|
- // ]
|
|
|
- // },
|
|
|
grid: {
|
|
|
left: '0',
|
|
|
right: '0',
|
|
@@ -666,55 +648,10 @@
|
|
|
color: '#fff'
|
|
|
}
|
|
|
},
|
|
|
- // ---- gird区域 ---
|
|
|
- // gird: {
|
|
|
- // show: false, // 是否显示直角坐标系网格
|
|
|
- // top: 10, // 相对位置 top\bottom\left\right
|
|
|
- // containLabel: false, // gird 区域是否包含坐标轴的刻度标签
|
|
|
- // tooltip: {
|
|
|
- // show: true,
|
|
|
- // trigger: 'item', // 触发类型
|
|
|
- // textStyle: {
|
|
|
- // color: '#666'
|
|
|
- // }
|
|
|
- // }
|
|
|
- // },
|
|
|
+
|
|
|
// ------ X轴 ------
|
|
|
xAxis: {
|
|
|
- // show: true, // 是否显示
|
|
|
- // position: 'bottom', // x轴的位置
|
|
|
- // offset: 0, // x轴相对于默认位置的偏移
|
|
|
- // type: 'category', // 轴类型, 默认为 'category'
|
|
|
- // name: '', // 轴名称
|
|
|
- // nameLocation: 'end', // 轴名称相对位置
|
|
|
- // nameTextStyle: { // 坐标轴名称样式
|
|
|
- // color: '#666',
|
|
|
- // padding: [5, 0, 0, -5]
|
|
|
- // },
|
|
|
- // nameGap: 30, // 坐标轴名称与轴线之间的距离
|
|
|
- // nameRotate: 0, // 坐标轴名字旋转
|
|
|
- // axisLine: { // 坐标轴 轴线
|
|
|
- // show: true, // 是否显示
|
|
|
- // // symbol: ['none', 'arrow'], // 是否显示轴线箭头
|
|
|
- // // symbolSize: [8, 8], // 箭头大小
|
|
|
- // // symbolOffset: [0, 7], // 箭头位置
|
|
|
- // // ------ 线 ---------
|
|
|
- // lineStyle: {
|
|
|
- // color: '#666',
|
|
|
- // width: 1,
|
|
|
- // type: 'solid'
|
|
|
- // }
|
|
|
- // },
|
|
|
- // axisTick: { // 坐标轴 刻度
|
|
|
- // show: true, // 是否显示
|
|
|
- // inside: true, // 是否朝内
|
|
|
- // length: 3, // 长度
|
|
|
- // lineStyle: { // 默认取轴线的样式
|
|
|
- // color: '#666',
|
|
|
- // width: 1,
|
|
|
- // type: 'solid'
|
|
|
- // }
|
|
|
- // },
|
|
|
+
|
|
|
axisLabel: { // 坐标轴标签
|
|
|
show: true, // 是否显示
|
|
|
inside: false, // 是否朝内
|
|
@@ -724,58 +661,20 @@
|
|
|
interval: 0,
|
|
|
rotate: 40
|
|
|
},
|
|
|
- // splitLine: { // gird区域中的分割线
|
|
|
- // show: false, // 是否显示
|
|
|
- // lineStyle: {
|
|
|
- // // color: 'red',
|
|
|
- // // width: 1,
|
|
|
- // // type: 'solid'
|
|
|
- // }
|
|
|
- // },
|
|
|
+
|
|
|
splitArea: { // 网格区域
|
|
|
show: false // 是否显示,默认为false
|
|
|
},
|
|
|
- data: ['玉米', '玉米(潮粮)', '玉米(酒精)', '玉米(机收)', '混合麦', '白小麦', '大豆', '水稻', '高粱', '玉米淀粉', '豆粕']
|
|
|
+ data: _x
|
|
|
},
|
|
|
// ------ y轴 ----------
|
|
|
yAxis: {
|
|
|
- // show: true, // 是否显示
|
|
|
- // position: 'left', // y轴位置
|
|
|
- // offset: 0, // y轴相对于默认位置的偏移
|
|
|
- // type: 'value', // 轴类型,默认为 ‘category’
|
|
|
- // // name: '销量', // 轴名称
|
|
|
- // nameLocation: 'end', // 轴名称相对位置value
|
|
|
- // nameTextStyle: { // 坐标轴名称样式
|
|
|
- // color: '#fff',
|
|
|
- // padding: [5, 0, 0, 5] // 坐标轴名称相对位置
|
|
|
- // },
|
|
|
- // nameGap: 15, // 坐标轴名称与轴线之间的距离
|
|
|
- // nameRotate: 270, // 坐标轴名字旋转
|
|
|
-
|
|
|
+
|
|
|
axisLine: { // 坐标轴 轴线
|
|
|
show: false, // 是否显示
|
|
|
- // ----- 箭头 -----
|
|
|
- // symbol: ['none', 'arrow'], // 是否显示轴线箭头
|
|
|
- // symbolSize: [8, 8], // 箭头大小
|
|
|
- // symbolOffset: [0, 7], // 箭头位置
|
|
|
-
|
|
|
- // ----- 线 -------
|
|
|
- // lineStyle: {
|
|
|
- // color: '#666',
|
|
|
- // width: 1,
|
|
|
- // type: 'solid'
|
|
|
- // }
|
|
|
+
|
|
|
},
|
|
|
- // axisTick: { // 坐标轴的刻度
|
|
|
- // show: true, // 是否显示
|
|
|
- // inside: true, // 是否朝内
|
|
|
- // length: 3, // 长度
|
|
|
- // lineStyle: {
|
|
|
- // color: '#666', // 默认取轴线的颜色
|
|
|
- // width: 1,
|
|
|
- // type: 'solid'
|
|
|
- // }
|
|
|
- // },
|
|
|
+
|
|
|
axisLabel: { // 坐标轴的标签
|
|
|
show: true, // 是否显示
|
|
|
inside: false, // 是否朝内
|
|
@@ -790,10 +689,7 @@
|
|
|
width: 1,
|
|
|
type: 'dashed'
|
|
|
}
|
|
|
- },
|
|
|
- // splitArea: { // 网格区域
|
|
|
- // show: false // 是否显示,默认为false
|
|
|
- // }
|
|
|
+ }
|
|
|
},
|
|
|
// ------- 内容数据 -------
|
|
|
series: [{
|
|
@@ -819,12 +715,10 @@
|
|
|
position: 'top',
|
|
|
color: '#b0b1b3'
|
|
|
},
|
|
|
- data: [3000, 4000, 4200, 4500, 6000, 5600, 4500, 5020, 4500, 5400, 4300]
|
|
|
+ data: _y
|
|
|
}]
|
|
|
};
|
|
|
-
|
|
|
myChart7.setOption(zoption)
|
|
|
-
|
|
|
},
|
|
|
handleClose(done) {
|
|
|
this.$confirm('确认关闭?')
|
|
@@ -1984,4 +1878,5 @@
|
|
|
right: 10px;
|
|
|
bottom: 10px;
|
|
|
}
|
|
|
+
|
|
|
</style>
|