|
|
@@ -1,13 +1,13 @@
|
|
|
<template>
|
|
|
<div class="app-container home">
|
|
|
<ul class="block">
|
|
|
- <li>
|
|
|
+ <li @click="jump('/business/inStock')">
|
|
|
<div>
|
|
|
<i class="el-icon-download" style="font-size: 50px;text-align: center"></i>
|
|
|
<p>入库</p>
|
|
|
</div>
|
|
|
</li>
|
|
|
- <li>
|
|
|
+ <li @click="jump('/business/outStock')">
|
|
|
<div>
|
|
|
<i class="el-icon-upload2" style="font-size: 50px;text-align: center"></i>
|
|
|
<p>出库</p>
|
|
|
@@ -25,7 +25,7 @@
|
|
|
<p>新增商品</p>
|
|
|
</div>
|
|
|
</li>
|
|
|
- <li>
|
|
|
+ <li @click="jump('/business/transfer')">
|
|
|
<div>
|
|
|
<i class="el-icon-connection" style="font-size: 50px;text-align: center"></i>
|
|
|
<p>调拨</p>
|
|
|
@@ -49,13 +49,13 @@
|
|
|
<p>对账</p>
|
|
|
</div>
|
|
|
</li>
|
|
|
- <li>
|
|
|
+ <li @click="jump('/business/goodsTransfer')">
|
|
|
<div>
|
|
|
<i class="el-icon-takeaway-box" style="font-size: 50px;text-align: center"></i>
|
|
|
<p>货转</p>
|
|
|
</div>
|
|
|
</li>
|
|
|
- <li>
|
|
|
+ <li @click="jump('/agreement/agreementStorage')">
|
|
|
<div>
|
|
|
<i class="el-icon-s-order" style="font-size: 50px;text-align: center"></i>
|
|
|
<p>协议</p>
|
|
|
@@ -65,6 +65,12 @@
|
|
|
<div style="width: 30%;float: right">
|
|
|
<div style="display: flex;">
|
|
|
<div id="box" style="width:100%;height:350px;"></div>
|
|
|
+
|
|
|
+ <el-select v-model="select" slot="prepend" size="mini" :select="query()" placeholder="点击切换仓库" style="position:absolute; width: 8%;right: 1%;">
|
|
|
+ <div v-for="(item, index) in warehouse" :key="index">
|
|
|
+ <el-option :label="item.fName" :value="item.fWarehouseid"></el-option>
|
|
|
+ </div>
|
|
|
+ </el-select>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div style="width: 100%;margin-bottom: 50px">
|
|
|
@@ -89,13 +95,14 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { listCorps , listCorps_s,listCorps_ss} from "../../src/api/index";
|
|
|
+import { listCorps , information, warehouse} from "../../src/api/index";
|
|
|
export default {
|
|
|
name: "index",
|
|
|
data() {
|
|
|
return {
|
|
|
// 版本号
|
|
|
version: "3.2.1",
|
|
|
+ select:'',
|
|
|
tableData: [{
|
|
|
date: '2020-11-20 12:00',
|
|
|
name: '某客户账单审核',
|
|
|
@@ -108,20 +115,77 @@ export default {
|
|
|
date: '2020-11-20 12:00',
|
|
|
name: '仓储费审核结算审核',
|
|
|
address: '查看详情'
|
|
|
- }]
|
|
|
+ }],
|
|
|
+ chart:[],
|
|
|
+ warehouse:[],
|
|
|
+ master:[],
|
|
|
+ commodity:[],
|
|
|
+ commoditytwo:[],
|
|
|
+ name:[]
|
|
|
};
|
|
|
},
|
|
|
mounted() {
|
|
|
- this.drawLine();
|
|
|
- this.drawLine_s();
|
|
|
- this.drawLine_ss();
|
|
|
+ this.drawLine_ss()
|
|
|
},
|
|
|
created(){
|
|
|
this.getList();
|
|
|
- this.getLabel_s();
|
|
|
- this.getLabel_ss();
|
|
|
+ this.warehouses();
|
|
|
+ this.firstinventory()
|
|
|
},
|
|
|
methods: {
|
|
|
+ firstinventory(){
|
|
|
+ information(0).then(response =>{
|
|
|
+ console.log(response)
|
|
|
+ this.chart = response.data
|
|
|
+ for (let index of this.chart.corpsListWhouse){
|
|
|
+ this.master.push({
|
|
|
+ name:index.fName,
|
|
|
+ value:index.fGrossweightD
|
|
|
+ })
|
|
|
+ this.name.push(index.fName)
|
|
|
+ }
|
|
|
+ for (let index of this.chart.goodslistWhouse){
|
|
|
+ this.commodity.push(index.fName)
|
|
|
+ this.commoditytwo.push(index.fGrossweightD)
|
|
|
+ }
|
|
|
+
|
|
|
+ this.drawLine()
|
|
|
+ this.drawLinetwo()
|
|
|
+ this.drawLine_ss()
|
|
|
+ })
|
|
|
+ },
|
|
|
+ query(){
|
|
|
+ this.master = []
|
|
|
+ this.commodity = []
|
|
|
+ this.commoditytwo = []
|
|
|
+ this.name = []
|
|
|
+ console.log(this.select)
|
|
|
+ if (this.select === ''){
|
|
|
+ return this.select
|
|
|
+ }else {
|
|
|
+ information(this.select).then(response =>{
|
|
|
+ console.log(response)
|
|
|
+ this.chart = response.data
|
|
|
+ for (let index of this.chart.corpsListWhouse){
|
|
|
+ this.master.push({
|
|
|
+ name:index.fName,
|
|
|
+ value:index.fGrossweightD
|
|
|
+ })
|
|
|
+ this.name.push(index.fName)
|
|
|
+ }
|
|
|
+ for (let index of this.chart.goodslistWhouse){
|
|
|
+ this.commodity.push(index.fName)
|
|
|
+ this.commoditytwo.push(index.fGrossweightD)
|
|
|
+ }
|
|
|
+ this.drawLine()
|
|
|
+ this.drawLinetwo()
|
|
|
+ this.drawLine_ss()
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ jump(res){
|
|
|
+ this.$router.push({ path: res })
|
|
|
+ },
|
|
|
//设置单元格边框
|
|
|
cellStyle({row, column, rowIndex, columnIndex}) {
|
|
|
return 'border-bottom: 1px dashed rgb(223, 230, 236)'
|
|
|
@@ -133,16 +197,16 @@ export default {
|
|
|
console.log(response.rows);
|
|
|
});
|
|
|
},
|
|
|
- // 仓库图表
|
|
|
- getLabel_s(){
|
|
|
- listCorps_s(this.queryParse).then(response =>{
|
|
|
- console.log(response.rows);
|
|
|
- })
|
|
|
- },
|
|
|
- // 商品图表
|
|
|
- getLabel_ss(){
|
|
|
- listCorps_ss(0).then(response =>{
|
|
|
- console.log(response);
|
|
|
+ //查询仓库
|
|
|
+ warehouses(){
|
|
|
+ warehouse().then(response =>{
|
|
|
+ this.warehouse = []
|
|
|
+ for (let index of response.rows){
|
|
|
+ this.warehouse.push({
|
|
|
+ fName:index.fName,
|
|
|
+ fWarehouseid:index.fWarehouseid
|
|
|
+ })
|
|
|
+ }
|
|
|
})
|
|
|
},
|
|
|
goTarget(href) {
|
|
|
@@ -155,7 +219,7 @@ export default {
|
|
|
// 绘制图表
|
|
|
myChart.setOption({
|
|
|
title: {
|
|
|
- text: '仓库库容统计',
|
|
|
+ text: this.chart.whouseList[0].fName + '统计',
|
|
|
subtext: '虚构数据',
|
|
|
left: 'center'
|
|
|
},
|
|
|
@@ -164,15 +228,14 @@ export default {
|
|
|
formatter: '{a} <br/>{b} : {c} ({d}%)'
|
|
|
},
|
|
|
legend: {
|
|
|
- // orient: 'vertical',
|
|
|
- // top: 'middle',
|
|
|
bottom: 10,
|
|
|
left: 'center',
|
|
|
- data: ['西凉', '益州', '兖州', '荆州']
|
|
|
+ data: ['空闲库容', '占用库容']
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
type: 'pie',
|
|
|
+ name: '虚构数据',
|
|
|
radius: '65%',
|
|
|
center: ['50%', '50%'],
|
|
|
selectedMode: 'single',
|
|
|
@@ -243,8 +306,8 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
- {value: 200, name: '占用库容'},
|
|
|
- {value: 500, name: '空闲库容'},
|
|
|
+ {value: this.chart.whouseList[0].fGrossweightD, name: '占用库容'},
|
|
|
+ {value: this.chart.whouseList[0].fTotalgross - this.chart.whouseList[0].fGrossweightD, name: '空闲库容'},
|
|
|
],
|
|
|
emphasis: {
|
|
|
itemStyle: {
|
|
|
@@ -257,71 +320,47 @@ export default {
|
|
|
]
|
|
|
});
|
|
|
},
|
|
|
- drawLine_s() {
|
|
|
+ drawLinetwo() {
|
|
|
// 基于准备好的dom，初始化echarts实例，所以只能在mounted中调用
|
|
|
let myChart = this.$echarts.init(document.getElementById('box_s'))
|
|
|
// 绘制图表
|
|
|
myChart.setOption({
|
|
|
- backgroundColor: '#fff',
|
|
|
-
|
|
|
title: {
|
|
|
- text: '货主库存占比统计',
|
|
|
- left: 'center',
|
|
|
- top: 20,
|
|
|
- textStyle: {
|
|
|
- color: '#333333'
|
|
|
- }
|
|
|
+ text: this.chart.whouseList[0].fName + '货权人统计',
|
|
|
+ subtext: '虚构数据',
|
|
|
+ left: 'center'
|
|
|
},
|
|
|
-
|
|
|
tooltip: {
|
|
|
trigger: 'item',
|
|
|
- formatter: '{a} <br/>{b} : {c} ({d}%)'
|
|
|
+ formatter: '{a} <br/>{b}: {c} ({d}%)'
|
|
|
},
|
|
|
-
|
|
|
- visualMap: {
|
|
|
- show: false,
|
|
|
- min: 80,
|
|
|
- max: 600,
|
|
|
- inRange: {
|
|
|
- colorLightness: [0, 1]
|
|
|
- }
|
|
|
+ legend: {
|
|
|
+ bottom: 10,
|
|
|
+ left: 'center',
|
|
|
+ data: this.name
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
- name: '虚构数据',
|
|
|
+ name: '访问来源',
|
|
|
type: 'pie',
|
|
|
- radius: '80%',
|
|
|
- center: ['50%', '60%'],
|
|
|
- data: [
|
|
|
- {value: 335, name: '货主1'},
|
|
|
- {value: 310, name: '货主2'},
|
|
|
- {value: 274, name: '货主3'},
|
|
|
- {value: 235, name: '货主4'},
|
|
|
- {value: 400, name: '货主5'}
|
|
|
- ].sort(function (a, b) { return a.value - b.value; }),
|
|
|
- roseType: 'radius',
|
|
|
+ radius: ['40%', '60%'],
|
|
|
+ avoidLabelOverlap: false,
|
|
|
label: {
|
|
|
- // color: 'rgba(0, 0, 0, 1)'
|
|
|
+ show: false,
|
|
|
+ position: 'center'
|
|
|
},
|
|
|
- labelLine: {
|
|
|
- lineStyle: {
|
|
|
- // color: 'rgba(51, 51, 51, 1)'
|
|
|
- },
|
|
|
- smooth: 0.2,
|
|
|
- length: 10,
|
|
|
- length2: 20
|
|
|
+ emphasis: {
|
|
|
+ label: {
|
|
|
+ // show: true,
|
|
|
+ fontSize: '30',
|
|
|
+ fontWeight: 'bold'
|
|
|
+ }
|
|
|
},
|
|
|
- itemStyle: {
|
|
|
- // color: '#000',
|
|
|
- // shadowBlur: 200,
|
|
|
- shadowColor: 'rgba(0, 0, 0, 0.5)'
|
|
|
+ labelLine: {
|
|
|
+ show: false
|
|
|
},
|
|
|
-
|
|
|
- animationType: 'scale',
|
|
|
- animationEasing: 'elasticOut',
|
|
|
- animationDelay: function (idx) {
|
|
|
- return Math.random() * 200;
|
|
|
- }
|
|
|
+ data:
|
|
|
+ this.master
|
|
|
}
|
|
|
]
|
|
|
});
|
|
|
@@ -352,7 +391,7 @@ export default {
|
|
|
xAxis: [
|
|
|
{
|
|
|
type: 'category',
|
|
|
- data: ['棉花', '淀粉', '木薯', '冰糖', '麻花', '海盐', '胡椒粉'],
|
|
|
+ data: this.commodity,
|
|
|
axisTick: {
|
|
|
alignWithLabel: true
|
|
|
}
|
|
|
@@ -368,7 +407,7 @@ export default {
|
|
|
name: '实时状态',
|
|
|
type: 'bar',
|
|
|
barWidth: '60%',
|
|
|
- data: [10, 52, 200, 334, 390, 330, 220]
|
|
|
+ data: this.commoditytwo
|
|
|
}
|
|
|
]
|
|
|
});
|
caojunjie