projects/mes-test #132
3
.env.dev
3
.env.dev
@ -14,10 +14,11 @@ VUE_APP_TITLE = MES系统
|
||||
# 芋道管理系统/开发环境
|
||||
# VUE_APP_BASE_API = 'http://100.64.0.26:48082'
|
||||
# VUE_APP_BASE_API = 'http://192.168.0.33:48082'
|
||||
VUE_APP_BASE_API = 'http://192.168.4.173:48080'
|
||||
# VUE_APP_BASE_API = 'http://192.168.2.173:48080'
|
||||
# VUE_APP_BASE_API = 'http://192.168.1.49:48080'
|
||||
# VUE_APP_BASE_API = 'http://192.168.1.8:48080'
|
||||
VUE_APP_BASE_API = 'http://192.168.1.56:48080'
|
||||
# VUE_APP_BASE_API = 'http://192.168.1.56:48080'
|
||||
# VUE_APP_BASE_API = 'http://192.168.1.188:48080'
|
||||
# VUE_APP_BASE_API = 'http://192.168.2.159:48080'
|
||||
|
||||
|
||||
@ -35,34 +35,39 @@
|
||||
<el-tabs v-model="activeName" @tab-click="toggleTab">
|
||||
<el-tab-pane label="数据列表" name="dataList">
|
||||
<!-- 列表 -->
|
||||
<base-table
|
||||
:page="queryParams.pageNo"
|
||||
:limit="queryParams.pageSize"
|
||||
:table-props="tableProps"
|
||||
:table-data="tableData"
|
||||
:max-height="tableH"
|
||||
>
|
||||
<method-btn
|
||||
v-if="tableBtn.length"
|
||||
slot="handleBtn"
|
||||
:width="150"
|
||||
label="操作"
|
||||
:method-list="tableBtn"
|
||||
@clickBtn="viewDetDetail"
|
||||
<div v-if="activeName === 'dataList'">
|
||||
<base-table
|
||||
:page="queryParams.pageNo"
|
||||
:limit="queryParams.pageSize"
|
||||
:table-props="tableProps"
|
||||
:table-data="tableData"
|
||||
:max-height="tableH"
|
||||
>
|
||||
<method-btn
|
||||
v-if="tableBtn.length"
|
||||
slot="handleBtn"
|
||||
:width="150"
|
||||
label="操作"
|
||||
:method-list="tableBtn"
|
||||
@clickBtn="viewDetDetail"
|
||||
/>
|
||||
</base-table>
|
||||
<pagination
|
||||
:page.sync="queryParams.pageNo"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
:total="total"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</base-table>
|
||||
<pagination
|
||||
:page.sync="queryParams.pageNo"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
:total="total"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="环形图" name="barChart">
|
||||
<div
|
||||
id="logDetPieBar"
|
||||
style="width: 182px; height: 180px;"
|
||||
></div>
|
||||
<div v-if="activeName === 'barChart'">
|
||||
<div
|
||||
id="logDetPieBar"
|
||||
style="width: 100%"
|
||||
:style="{ height: chartHeight + 'px' }"
|
||||
></div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
@ -110,6 +115,8 @@
|
||||
<script>
|
||||
import { deliveryLogPage, deliveryLogDetPage } from '@/api/base/delivery'
|
||||
import { parseTime } from '@/utils/ruoyi'
|
||||
import * as echarts from 'echarts'
|
||||
import resize from '@/utils/chartMixins/resize'
|
||||
const tableProps = [
|
||||
{
|
||||
prop: 'deliveryTime',
|
||||
@ -182,6 +189,7 @@ const tableProps2 = [
|
||||
]
|
||||
export default {
|
||||
name: 'DeliveryLogDetDetail',
|
||||
mixins: [resize],
|
||||
data() {
|
||||
return {
|
||||
centervisible: false,
|
||||
@ -195,6 +203,7 @@ export default {
|
||||
orderMsg: {},
|
||||
tableProps,
|
||||
tableData: [],
|
||||
total: 0,
|
||||
tableH: this.tableHeight(350),
|
||||
tableBtn: [
|
||||
this.$auth.hasPermi('base:group-team:update')
|
||||
@ -215,9 +224,18 @@ export default {
|
||||
tableData2: [],
|
||||
tableH2: this.tableHeight(275),
|
||||
total2: 0,
|
||||
logCode: ''
|
||||
logCode: '',
|
||||
// 图
|
||||
chartDom: '',
|
||||
chart: '',
|
||||
chartHeight: this.tableHeight(300)
|
||||
}
|
||||
},
|
||||
// watch: {
|
||||
// chartData: function () {
|
||||
// this.getChart()
|
||||
// }
|
||||
// },
|
||||
mounted() {
|
||||
window.addEventListener('resize', () => {
|
||||
this.tableH = this.tableHeight(350)
|
||||
@ -225,6 +243,9 @@ export default {
|
||||
window.addEventListener('resize', () => {
|
||||
this.tableH2 = this.tableHeight(275)
|
||||
})
|
||||
window.addEventListener('resize', () => {
|
||||
this.chartHeight = this.tableHeight(300)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
init(params) {
|
||||
@ -236,13 +257,87 @@ export default {
|
||||
getList() {
|
||||
deliveryLogPage({...this.queryParams}).then(res => {
|
||||
this.tableData = res.data.list || []
|
||||
this.taotal = res.data.total || 0
|
||||
})
|
||||
},
|
||||
toggleTab() {
|
||||
|
||||
if (this.activeName === 'barChart') {
|
||||
this.$nextTick(() => {
|
||||
this.getBar()
|
||||
})
|
||||
}
|
||||
},
|
||||
getBar() {
|
||||
if (
|
||||
this.chart !== null &&
|
||||
this.chart !== '' &&
|
||||
this.chart !== undefined
|
||||
) {
|
||||
this.chart.dispose() // 页面多次刷新会出现警告，Dom已经初始化了一个实例，这是销毁实例
|
||||
}
|
||||
this.chartDom = document.getElementById('logDetPieBar')
|
||||
this.chart = echarts.init(this.chartDom)
|
||||
let seriesData = []
|
||||
let sumData = 0
|
||||
this.tableData && this.tableData.map(item =>{
|
||||
let obj = {}
|
||||
obj.value = item.rate
|
||||
obj.name = item.name
|
||||
seriesData.push(obj)
|
||||
sumData+=item.rate
|
||||
})
|
||||
if (sumData < 100) {
|
||||
let obj = {}
|
||||
obj.value = 100 - sumData
|
||||
obj.name = "未发货"
|
||||
seriesData.push(obj)
|
||||
}
|
||||
var option = {
|
||||
color: ['#B0EB42', '#FF9747', '#FF6860', '#7164FF', '#288AFF', '#63BDFF', '#73DE93', '#FFCE6A'],
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
formatter: function(params) {
|
||||
let str = `<span style="display:inline-block;width:8px;height:8px;margin: 0 8px 0 -3px;border-radius:2px;background-color:${params.color};"></span>`
|
||||
return `<span>
|
||||
<span style="color:rgba(0,0,0,0.85);">${str}${params.name}</span>
|
||||
<span style="display:inline-block;margin-left:10px;color:rgba(0,0,0,0.45);">${params.percent}</span>
|
||||
</span>`
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
bottom: '5%',
|
||||
left: 'center',
|
||||
icon: 'rect',
|
||||
itemHeight: 8,
|
||||
itemWidth: 8
|
||||
},
|
||||
series: [
|
||||
{
|
||||
type: 'pie',
|
||||
radius: ['60%', '80%'],
|
||||
avoidLabelOverlap: false,
|
||||
label: {
|
||||
show: false,
|
||||
position: 'center'
|
||||
},
|
||||
emphasis: {
|
||||
label: {
|
||||
show: true,
|
||||
fontSize: 40,
|
||||
fontWeight: 'bold'
|
||||
},
|
||||
scale: true ,
|
||||
scaleSize: 20 ,
|
||||
},
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data: seriesData
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
option && this.chart.setOption(option);
|
||||
},
|
||||
viewDetDetail(val) {
|
||||
this.logCode = val.data.code
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-drawer title="参数绑定" :visible.sync="visible" size="70%" @close='closeD'>
|
||||
<el-drawer :title="drawerTitle" :visible.sync="visible" size="70%" @close='closeD'>
|
||||
<div class="box">
|
||||
<el-form :inline="true">
|
||||
<el-form-item label="关联表名">
|
||||
@ -94,6 +94,7 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
drawerTitle: '',
|
||||
tableProps,
|
||||
tableData: [],
|
||||
tableBtn: [],
|
||||
@ -131,9 +132,11 @@ export default {
|
||||
this.objName = data.objName
|
||||
this.getList()
|
||||
if (title === 'detail') {
|
||||
this.drawerTitle = '查看参数'
|
||||
this.showBtn = false
|
||||
this.tableBtn = []
|
||||
} else {
|
||||
this.drawerTitle = '参数绑定'
|
||||
this.showBtn = true
|
||||
this.tableBtn = [
|
||||
{
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-drawer title="参数绑定" :visible.sync="visible" size="70%" @close='closeD'>
|
||||
<el-drawer :title="drawerTitle" :visible.sync="visible" size="70%" @close='closeD'>
|
||||
<div class="box">
|
||||
<el-form :inline="true">
|
||||
<el-form-item label="方案名称">
|
||||
@ -85,6 +85,7 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
drawerTitle: '',
|
||||
tableProps,
|
||||
tableData: [],
|
||||
tableBtn: [],
|
||||
@ -125,9 +126,11 @@ export default {
|
||||
this.energyTypeId = data.energyTypeId
|
||||
this.getList()
|
||||
if (title === 'detail') {
|
||||
this.drawerTitle = '查看参数'
|
||||
this.showBtn = false
|
||||
this.tableBtn = []
|
||||
} else {
|
||||
this.drawerTitle = '参数绑定'
|
||||
this.showBtn = true
|
||||
this.tableBtn = [
|
||||
{
|
||||
|
||||
@ -60,31 +60,31 @@ export default {
|
||||
this.chart = echarts.init(this.$el, 'macarons');
|
||||
|
||||
this.chart.setOption({
|
||||
title: {
|
||||
text: this.title
|
||||
? '{space|}{tip|}{space|}{value|' + this.title + '}'
|
||||
: '',
|
||||
left: '0%',
|
||||
top: '0%',
|
||||
textStyle: {
|
||||
rich: {
|
||||
tip: {
|
||||
width: 4,
|
||||
height: 18,
|
||||
backgroundColor: '#0B58FF',
|
||||
marginRight: 6,
|
||||
},
|
||||
space: {
|
||||
width: 8,
|
||||
},
|
||||
value: {
|
||||
fontSize: 16,
|
||||
fontWeight: 'bold',
|
||||
color: 'black',
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
// title: {
|
||||
// text: this.title
|
||||
// ? '{space|}{tip|}{space|}{value|' + this.title + '}'
|
||||
// : '',
|
||||
// left: '0%',
|
||||
// top: '0%',
|
||||
// textStyle: {
|
||||
// rich: {
|
||||
// tip: {
|
||||
// width: 4,
|
||||
// height: 18,
|
||||
// backgroundColor: '#0B58FF',
|
||||
// marginRight: 6,
|
||||
// },
|
||||
// space: {
|
||||
// width: 8,
|
||||
// },
|
||||
// value: {
|
||||
// fontSize: 16,
|
||||
// fontWeight: 'bold',
|
||||
// color: 'black',
|
||||
// },
|
||||
// },
|
||||
// },
|
||||
// },
|
||||
color: ['#288AFF', '#8EF0AB', '#FFDC94'],
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
@ -148,6 +148,7 @@ export default {
|
||||
yAxis: [
|
||||
{
|
||||
gridIndex: 0,
|
||||
name: '库存数量',
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
@ -160,6 +161,7 @@ export default {
|
||||
},
|
||||
{
|
||||
gridIndex: 1,
|
||||
name: '剩余使用天数',
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
|
||||
@ -59,7 +59,7 @@ export default {
|
||||
zlevel: 2, // 控制圆环图中间的字的层级
|
||||
text: '总数',
|
||||
subtext: totalNumber,
|
||||
top: '42%', // 控制位置
|
||||
top: '35%', // 控制位置
|
||||
left: '50%', // 控制位置
|
||||
textAlign: 'center', // 让文字居中
|
||||
textStyle: {
|
||||
@ -72,7 +72,7 @@ export default {
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
show: true, // 控制鼠标悬浮是否显示数据
|
||||
formatter: '产品: {b}<br/>数量: {c}<br/>占比: {d}%',
|
||||
formatter: '{b}<br/>数量: {c}<br/>占比: {d}%',
|
||||
},
|
||||
legend: {
|
||||
orient: 'vartical',
|
||||
|
||||
@ -2,16 +2,20 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2023-08-22 15:01:54
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2023-11-04 16:32:13
|
||||
* @LastEditTime: 2023-11-07 14:12:00
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-row :gutter="10" class="chart-container">
|
||||
<el-col :span="14">
|
||||
<el-col :span="wareType === 1 ? 14 : 24">
|
||||
<div class="chart-card">
|
||||
<div class="title">库存总览</div>
|
||||
<div class="sub-title">产品总数量
|
||||
<div style="color: black;">{{ totalNum }}</div>
|
||||
</div>
|
||||
<barChart
|
||||
ref="barChart"
|
||||
height="500px"
|
||||
height="600px"
|
||||
title="库存总览"
|
||||
v-if="overviewList.length"
|
||||
:histogram="overviewList" />
|
||||
@ -19,16 +23,18 @@
|
||||
<div class="no-data-bg" v-else></div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="10">
|
||||
<el-col :span="wareType === 1 ? 10 : 0">
|
||||
<div class="chart-card">
|
||||
<div class="title">库位占用率</div>
|
||||
<pieChart
|
||||
ref="pieChart"
|
||||
height="600px"
|
||||
title="库位占用率"
|
||||
v-if="rateList.length"
|
||||
:pie-data="rateList" />
|
||||
<!-- 没有数据 -->
|
||||
<div class="no-data-bg" v-else></div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
@ -36,46 +42,62 @@
|
||||
<script>
|
||||
import barChart from '../../chart/BarChart.vue';
|
||||
import pieChart from '../../chart/PieChart.vue';
|
||||
import {
|
||||
getOverview,
|
||||
getRate,
|
||||
} from '@/api/warehouse/warehouseLocation';
|
||||
import { getOverview, getRate } from '@/api/warehouse/warehouseLocation';
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
urlOptions: {
|
||||
allURL: getOverview,
|
||||
rateURL: getRate
|
||||
rateURL: getRate,
|
||||
},
|
||||
listQuery: {
|
||||
storageType: 2,
|
||||
},
|
||||
wareType: 1,
|
||||
totalNum: 0,
|
||||
overviewList: [],
|
||||
rateList: []
|
||||
rateList: [],
|
||||
};
|
||||
},
|
||||
components: {
|
||||
barChart,
|
||||
pieChart
|
||||
pieChart,
|
||||
},
|
||||
mounted() {
|
||||
this.getDataList();
|
||||
},
|
||||
created() {
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === this.listQuery.storageType) {
|
||||
this.wareType = item.type;
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
// 获取数据列表
|
||||
getDataList() {
|
||||
const data = {
|
||||
storageType : 2
|
||||
}
|
||||
this.urlOptions.allURL(data).then((response) => {
|
||||
this.overviewList = response.data;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.barChart.initChart();
|
||||
});
|
||||
this.urlOptions.allURL(this.listQuery).then((response) => {
|
||||
if (response.data && response.data.length) {
|
||||
this.overviewList = response.data;
|
||||
this.overviewList.forEach(item=>{
|
||||
this.totalNum += item.num
|
||||
})
|
||||
this.$nextTick(() => {
|
||||
this.$refs.barChart.initChart();
|
||||
});
|
||||
}
|
||||
});
|
||||
this.urlOptions.rateURL(data).then((response) => {
|
||||
this.rateList = response.data;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.pieChart.initChart();
|
||||
});
|
||||
this.urlOptions.rateURL(this.listQuery).then((response) => {
|
||||
if (response.data && response.data.length) {
|
||||
this.rateList = response.data;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.pieChart.initChart();
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
@ -93,4 +115,33 @@ export default {
|
||||
padding: 16px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
.title {
|
||||
font-size: 18px;
|
||||
line-height: 16px;
|
||||
margin-bottom: 10px;
|
||||
color: #000;
|
||||
font-weight: 500;
|
||||
font-family: '微软雅黑', 'Microsoft YaHei', Arial, Helvetica, sans-serif;
|
||||
}
|
||||
.title::before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
width: 4px;
|
||||
height: 16px;
|
||||
border-radius: 1px;
|
||||
margin-right: 5px;
|
||||
background-color: #0b58ff;
|
||||
}
|
||||
.sub-title{
|
||||
font-size: 16px;
|
||||
line-height: 18px;
|
||||
color: #888686;
|
||||
min-width: 80px;
|
||||
text-align: center;
|
||||
font-weight: 500;
|
||||
margin-right: 30px;
|
||||
font-family: '微软雅黑', 'Microsoft YaHei', Arial, Helvetica, sans-serif;
|
||||
float: right;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -58,7 +58,7 @@ import {
|
||||
getWarehouseLocationHisPage,
|
||||
} from '@/api/warehouse/warehouseRealtimeLocation';
|
||||
import { listByWarehouse } from '@/api/warehouse/warehouseLocation';
|
||||
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
import { listData } from '@/api/system/dict/data';
|
||||
import { publicFormatter } from '@/utils/dict';
|
||||
|
||||
@ -179,8 +179,14 @@ export default {
|
||||
listData(queryParams).then((response) => {
|
||||
this.formConfig[2].selectOptions = response.data.list;
|
||||
});
|
||||
listByWarehouse(this.listQuery.storageType).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === this.listQuery.storageType) {
|
||||
listByWarehouse(item.id).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2023-08-21 14:26:23
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2023-11-04 14:46:59
|
||||
* @LastEditTime: 2023-11-06 11:25:34
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
@ -93,7 +93,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listByWarehouse, listAll } from '@/api/warehouse/warehouseLocation';
|
||||
import { listByWarehouse } from '@/api/warehouse/warehouseLocation';
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
@ -129,7 +130,10 @@ export default {
|
||||
there: [],
|
||||
four: [],
|
||||
}),
|
||||
listAll(1).then((response) => {
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === 2) {
|
||||
listByWarehouse(item.id).then((response) => {
|
||||
response.data.forEach((a, b) => {
|
||||
if (b % 4 === 0) {
|
||||
this.wareData.one.push(a);
|
||||
@ -142,7 +146,10 @@ export default {
|
||||
}
|
||||
});
|
||||
this.total = Math.ceil(response.data.length / 40);
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
buttonClick(val) {
|
||||
switch (val.btnName) {
|
||||
|
||||
@ -64,7 +64,7 @@ import {
|
||||
outWarehouseRealtimeLocation,
|
||||
} from '@/api/warehouse/warehouseRealtimeLocation';
|
||||
import { listByWarehouse } from '@/api/warehouse/warehouseLocation';
|
||||
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
import { listData } from '@/api/system/dict/data';
|
||||
import { publicFormatter } from '@/utils/dict';
|
||||
import { mapGetters } from 'vuex';
|
||||
@ -203,8 +203,14 @@ export default {
|
||||
listData(queryParams).then((response) => {
|
||||
this.formConfig[2].selectOptions = response.data.list;
|
||||
});
|
||||
listByWarehouse(this.listQuery.storageType).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === this.listQuery.storageType) {
|
||||
listByWarehouse(item.id).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
|
||||
@ -2,16 +2,20 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2023-08-22 15:01:54
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2023-11-04 16:11:36
|
||||
* @LastEditTime: 2023-11-07 14:11:50
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-row :gutter="10" class="chart-container">
|
||||
<el-col :span="14">
|
||||
<el-col :span="wareType === 1 ? 14 : 24">
|
||||
<div class="chart-card">
|
||||
<div class="title">库存总览</div>
|
||||
<div class="sub-title">产品总数量
|
||||
<div style="color: black;">{{ totalNum }}</div>
|
||||
</div>
|
||||
<barChart
|
||||
ref="barChart"
|
||||
height="500px"
|
||||
height="600px"
|
||||
title="库存总览"
|
||||
v-if="overviewList.length"
|
||||
:histogram="overviewList" />
|
||||
@ -19,16 +23,18 @@
|
||||
<div class="no-data-bg" v-else></div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="10">
|
||||
<el-col :span="wareType === 1 ? 10 : 0">
|
||||
<div class="chart-card">
|
||||
<div class="title">库位占用率</div>
|
||||
<pieChart
|
||||
ref="pieChart"
|
||||
height="600px"
|
||||
title="库位占用率"
|
||||
v-if="rateList.length"
|
||||
:pie-data="rateList" />
|
||||
<!-- 没有数据 -->
|
||||
<div class="no-data-bg" v-else></div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
@ -36,46 +42,62 @@
|
||||
<script>
|
||||
import barChart from '../../chart/BarChart.vue';
|
||||
import pieChart from '../../chart/PieChart.vue';
|
||||
import {
|
||||
getOverview,
|
||||
getRate,
|
||||
} from '@/api/warehouse/warehouseLocation';
|
||||
import { getOverview, getRate } from '@/api/warehouse/warehouseLocation';
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
urlOptions: {
|
||||
allURL: getOverview,
|
||||
rateURL: getRate
|
||||
rateURL: getRate,
|
||||
},
|
||||
listQuery: {
|
||||
storageType: 5,
|
||||
},
|
||||
wareType: 1,
|
||||
totalNum: 0,
|
||||
overviewList: [],
|
||||
rateList: []
|
||||
rateList: [],
|
||||
};
|
||||
},
|
||||
components: {
|
||||
barChart,
|
||||
pieChart
|
||||
pieChart,
|
||||
},
|
||||
mounted() {
|
||||
this.getDataList();
|
||||
},
|
||||
created() {
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === this.listQuery.storageType) {
|
||||
this.wareType = item.type;
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
// 获取数据列表
|
||||
getDataList() {
|
||||
const data = {
|
||||
storageType : 5
|
||||
}
|
||||
this.urlOptions.allURL(data).then((response) => {
|
||||
this.overviewList = response.data;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.barChart.initChart();
|
||||
});
|
||||
this.urlOptions.allURL(this.listQuery).then((response) => {
|
||||
if (response.data && response.data.length) {
|
||||
this.overviewList = response.data;
|
||||
this.overviewList.forEach(item=>{
|
||||
this.totalNum += item.num
|
||||
})
|
||||
this.$nextTick(() => {
|
||||
this.$refs.barChart.initChart();
|
||||
});
|
||||
}
|
||||
});
|
||||
this.urlOptions.rateURL(data).then((response) => {
|
||||
this.rateList = response.data;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.pieChart.initChart();
|
||||
});
|
||||
this.urlOptions.rateURL(this.listQuery).then((response) => {
|
||||
if (response.data && response.data.length) {
|
||||
this.rateList = response.data;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.pieChart.initChart();
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
@ -93,4 +115,33 @@ export default {
|
||||
padding: 16px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
.title {
|
||||
font-size: 18px;
|
||||
line-height: 16px;
|
||||
margin-bottom: 10px;
|
||||
color: #000;
|
||||
font-weight: 500;
|
||||
font-family: '微软雅黑', 'Microsoft YaHei', Arial, Helvetica, sans-serif;
|
||||
}
|
||||
.title::before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
width: 4px;
|
||||
height: 16px;
|
||||
border-radius: 1px;
|
||||
margin-right: 5px;
|
||||
background-color: #0b58ff;
|
||||
}
|
||||
.sub-title{
|
||||
font-size: 16px;
|
||||
line-height: 18px;
|
||||
color: #888686;
|
||||
min-width: 80px;
|
||||
text-align: center;
|
||||
font-weight: 500;
|
||||
margin-right: 30px;
|
||||
font-family: '微软雅黑', 'Microsoft YaHei', Arial, Helvetica, sans-serif;
|
||||
float: right;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -58,7 +58,7 @@ import {
|
||||
getWarehouseLocationHisPage,
|
||||
} from '@/api/warehouse/warehouseRealtimeLocation';
|
||||
import { listByWarehouse } from '@/api/warehouse/warehouseLocation';
|
||||
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
import { listData } from '@/api/system/dict/data';
|
||||
import { publicFormatter } from '@/utils/dict';
|
||||
|
||||
@ -179,8 +179,14 @@ export default {
|
||||
listData(queryParams).then((response) => {
|
||||
this.formConfig[2].selectOptions = response.data.list;
|
||||
});
|
||||
listByWarehouse(this.listQuery.storageType).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === this.listQuery.storageType) {
|
||||
listByWarehouse(item.id).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2023-08-21 14:26:23
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2023-11-04 14:46:59
|
||||
* @LastEditTime: 2023-11-06 11:32:23
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
@ -93,7 +93,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listByWarehouse, listAll } from '@/api/warehouse/warehouseLocation';
|
||||
import { listByWarehouse } from '@/api/warehouse/warehouseLocation';
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
@ -129,7 +130,10 @@ export default {
|
||||
there: [],
|
||||
four: [],
|
||||
}),
|
||||
listAll(1).then((response) => {
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === 5) {
|
||||
listByWarehouse(item.id).then((response) => {
|
||||
response.data.forEach((a, b) => {
|
||||
if (b % 4 === 0) {
|
||||
this.wareData.one.push(a);
|
||||
@ -142,7 +146,10 @@ export default {
|
||||
}
|
||||
});
|
||||
this.total = Math.ceil(response.data.length / 40);
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
buttonClick(val) {
|
||||
switch (val.btnName) {
|
||||
|
||||
@ -64,7 +64,7 @@ import {
|
||||
outWarehouseRealtimeLocation,
|
||||
} from '@/api/warehouse/warehouseRealtimeLocation';
|
||||
import { listByWarehouse } from '@/api/warehouse/warehouseLocation';
|
||||
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
import { listData } from '@/api/system/dict/data';
|
||||
import { publicFormatter } from '@/utils/dict';
|
||||
import { mapGetters } from 'vuex';
|
||||
@ -203,8 +203,14 @@ export default {
|
||||
listData(queryParams).then((response) => {
|
||||
this.formConfig[2].selectOptions = response.data.list;
|
||||
});
|
||||
listByWarehouse(this.listQuery.storageType).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === this.listQuery.storageType) {
|
||||
listByWarehouse(item.id).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
|
||||
@ -2,16 +2,20 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2023-08-22 15:01:54
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2023-11-04 16:06:10
|
||||
* @LastEditTime: 2023-11-07 14:11:37
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-row :gutter="10" class="chart-container">
|
||||
<el-col :span="14">
|
||||
<el-col :span="wareType === 1 ? 14 : 24">
|
||||
<div class="chart-card">
|
||||
<div class="title">库存总览</div>
|
||||
<div class="sub-title">产品总数量
|
||||
<div style="color: black;">{{ totalNum }}</div>
|
||||
</div>
|
||||
<barChart
|
||||
ref="barChart"
|
||||
height="500px"
|
||||
height="600px"
|
||||
title="库存总览"
|
||||
v-if="overviewList.length"
|
||||
:histogram="overviewList" />
|
||||
@ -19,16 +23,18 @@
|
||||
<div class="no-data-bg" v-else></div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="10">
|
||||
<el-col :span="wareType === 1 ? 10 : 0">
|
||||
<div class="chart-card">
|
||||
<div class="title">库位占用率</div>
|
||||
<pieChart
|
||||
ref="pieChart"
|
||||
height="600px"
|
||||
title="库位占用率"
|
||||
v-if="rateList.length"
|
||||
:pie-data="rateList" />
|
||||
<!-- 没有数据 -->
|
||||
<div class="no-data-bg" v-else></div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
@ -36,46 +42,62 @@
|
||||
<script>
|
||||
import barChart from '../../chart/BarChart.vue';
|
||||
import pieChart from '../../chart/PieChart.vue';
|
||||
import {
|
||||
getOverview,
|
||||
getRate,
|
||||
} from '@/api/warehouse/warehouseLocation';
|
||||
import { getOverview, getRate } from '@/api/warehouse/warehouseLocation';
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
urlOptions: {
|
||||
allURL: getOverview,
|
||||
rateURL: getRate
|
||||
rateURL: getRate,
|
||||
},
|
||||
listQuery: {
|
||||
storageType: 3,
|
||||
},
|
||||
wareType: 1,
|
||||
totalNum: 0,
|
||||
overviewList: [],
|
||||
rateList: []
|
||||
rateList: [],
|
||||
};
|
||||
},
|
||||
components: {
|
||||
barChart,
|
||||
pieChart
|
||||
pieChart,
|
||||
},
|
||||
mounted() {
|
||||
this.getDataList();
|
||||
},
|
||||
created() {
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === this.listQuery.storageType) {
|
||||
this.wareType = item.type;
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
// 获取数据列表
|
||||
getDataList() {
|
||||
const data = {
|
||||
storageType : 3
|
||||
}
|
||||
this.urlOptions.allURL(data).then((response) => {
|
||||
this.overviewList = response.data;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.barChart.initChart();
|
||||
});
|
||||
this.urlOptions.allURL(this.listQuery).then((response) => {
|
||||
if (response.data && response.data.length) {
|
||||
this.overviewList = response.data;
|
||||
this.overviewList.forEach(item=>{
|
||||
this.totalNum += item.num
|
||||
})
|
||||
this.$nextTick(() => {
|
||||
this.$refs.barChart.initChart();
|
||||
});
|
||||
}
|
||||
});
|
||||
this.urlOptions.rateURL(data).then((response) => {
|
||||
this.rateList = response.data;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.pieChart.initChart();
|
||||
});
|
||||
this.urlOptions.rateURL(this.listQuery).then((response) => {
|
||||
if (response.data && response.data.length) {
|
||||
this.rateList = response.data;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.pieChart.initChart();
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
@ -93,4 +115,33 @@ export default {
|
||||
padding: 16px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
.title {
|
||||
font-size: 18px;
|
||||
line-height: 16px;
|
||||
margin-bottom: 10px;
|
||||
color: #000;
|
||||
font-weight: 500;
|
||||
font-family: '微软雅黑', 'Microsoft YaHei', Arial, Helvetica, sans-serif;
|
||||
}
|
||||
.title::before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
width: 4px;
|
||||
height: 16px;
|
||||
border-radius: 1px;
|
||||
margin-right: 5px;
|
||||
background-color: #0b58ff;
|
||||
}
|
||||
.sub-title{
|
||||
font-size: 16px;
|
||||
line-height: 18px;
|
||||
color: #888686;
|
||||
min-width: 80px;
|
||||
text-align: center;
|
||||
font-weight: 500;
|
||||
margin-right: 30px;
|
||||
font-family: '微软雅黑', 'Microsoft YaHei', Arial, Helvetica, sans-serif;
|
||||
float: right;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -58,7 +58,7 @@ import {
|
||||
getWarehouseLocationHisPage,
|
||||
} from '@/api/warehouse/warehouseRealtimeLocation';
|
||||
import { listByWarehouse } from '@/api/warehouse/warehouseLocation';
|
||||
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
import { listData } from '@/api/system/dict/data';
|
||||
import { publicFormatter } from '@/utils/dict';
|
||||
|
||||
@ -179,8 +179,14 @@ export default {
|
||||
listData(queryParams).then((response) => {
|
||||
this.formConfig[2].selectOptions = response.data.list;
|
||||
});
|
||||
listByWarehouse(3).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === this.listQuery.storageType) {
|
||||
listByWarehouse(item.id).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2023-08-21 14:26:23
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2023-11-04 14:46:59
|
||||
* @LastEditTime: 2023-11-06 11:31:52
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
@ -93,7 +93,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listByWarehouse, listAll } from '@/api/warehouse/warehouseLocation';
|
||||
import { listByWarehouse } from '@/api/warehouse/warehouseLocation';
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
@ -129,7 +130,10 @@ export default {
|
||||
there: [],
|
||||
four: [],
|
||||
}),
|
||||
listAll(1).then((response) => {
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === 3) {
|
||||
listByWarehouse(item.id).then((response) => {
|
||||
response.data.forEach((a, b) => {
|
||||
if (b % 4 === 0) {
|
||||
this.wareData.one.push(a);
|
||||
@ -142,7 +146,10 @@ export default {
|
||||
}
|
||||
});
|
||||
this.total = Math.ceil(response.data.length / 40);
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
buttonClick(val) {
|
||||
switch (val.btnName) {
|
||||
|
||||
@ -64,7 +64,7 @@ import {
|
||||
outWarehouseRealtimeLocation,
|
||||
} from '@/api/warehouse/warehouseRealtimeLocation';
|
||||
import { listByWarehouse } from '@/api/warehouse/warehouseLocation';
|
||||
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
import { listData } from '@/api/system/dict/data';
|
||||
import { publicFormatter } from '@/utils/dict';
|
||||
import { mapGetters } from 'vuex';
|
||||
@ -203,8 +203,14 @@ export default {
|
||||
listData(queryParams).then((response) => {
|
||||
this.formConfig[2].selectOptions = response.data.list;
|
||||
});
|
||||
listByWarehouse(3).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === this.listQuery.storageType) {
|
||||
listByWarehouse(item.id).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
|
||||
@ -2,16 +2,20 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2023-08-22 15:01:54
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2023-11-04 16:24:11
|
||||
* @LastEditTime: 2023-11-07 14:11:24
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-row :gutter="10" class="chart-container">
|
||||
<el-col :span="14">
|
||||
<el-col :span="wareType === 1 ? 14 : 24">
|
||||
<div class="chart-card">
|
||||
<div class="title">库存总览</div>
|
||||
<div class="sub-title">产品总数量
|
||||
<div style="color: black;">{{ totalNum }}</div>
|
||||
</div>
|
||||
<barChart
|
||||
ref="barChart"
|
||||
height="500px"
|
||||
height="600px"
|
||||
title="库存总览"
|
||||
v-if="overviewList.length"
|
||||
:histogram="overviewList" />
|
||||
@ -19,16 +23,18 @@
|
||||
<div class="no-data-bg" v-else></div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="10">
|
||||
<el-col :span="wareType === 1 ? 10 : 0">
|
||||
<div class="chart-card">
|
||||
<div class="title">库位占用率</div>
|
||||
<pieChart
|
||||
ref="pieChart"
|
||||
height="600px"
|
||||
title="库位占用率"
|
||||
v-if="rateList.length"
|
||||
:pie-data="rateList" />
|
||||
<!-- 没有数据 -->
|
||||
<div class="no-data-bg" v-else></div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
@ -36,46 +42,62 @@
|
||||
<script>
|
||||
import barChart from '../../chart/BarChart.vue';
|
||||
import pieChart from '../../chart/PieChart.vue';
|
||||
import {
|
||||
getOverview,
|
||||
getRate,
|
||||
} from '@/api/warehouse/warehouseLocation';
|
||||
import { getOverview, getRate } from '@/api/warehouse/warehouseLocation';
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
urlOptions: {
|
||||
allURL: getOverview,
|
||||
rateURL: getRate
|
||||
rateURL: getRate,
|
||||
},
|
||||
listQuery: {
|
||||
storageType: 4,
|
||||
},
|
||||
wareType: 1,
|
||||
totalNum: 0,
|
||||
overviewList: [],
|
||||
rateList: []
|
||||
rateList: [],
|
||||
};
|
||||
},
|
||||
components: {
|
||||
barChart,
|
||||
pieChart
|
||||
pieChart,
|
||||
},
|
||||
mounted() {
|
||||
this.getDataList();
|
||||
},
|
||||
created() {
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === this.listQuery.storageType) {
|
||||
this.wareType = item.type;
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
// 获取数据列表
|
||||
getDataList() {
|
||||
const data = {
|
||||
storageType : 4
|
||||
}
|
||||
this.urlOptions.allURL(data).then((response) => {
|
||||
this.overviewList = response.data;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.barChart.initChart();
|
||||
});
|
||||
this.urlOptions.allURL(this.listQuery).then((response) => {
|
||||
if (response.data && response.data.length) {
|
||||
this.overviewList = response.data;
|
||||
this.overviewList.forEach(item=>{
|
||||
this.totalNum += item.num
|
||||
})
|
||||
this.$nextTick(() => {
|
||||
this.$refs.barChart.initChart();
|
||||
});
|
||||
}
|
||||
});
|
||||
this.urlOptions.rateURL(data).then((response) => {
|
||||
this.rateList = response.data;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.pieChart.initChart();
|
||||
});
|
||||
this.urlOptions.rateURL(this.listQuery).then((response) => {
|
||||
if (response.data && response.data.length) {
|
||||
this.rateList = response.data;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.pieChart.initChart();
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
@ -93,4 +115,33 @@ export default {
|
||||
padding: 16px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
.title {
|
||||
font-size: 18px;
|
||||
line-height: 16px;
|
||||
margin-bottom: 10px;
|
||||
color: #000;
|
||||
font-weight: 500;
|
||||
font-family: '微软雅黑', 'Microsoft YaHei', Arial, Helvetica, sans-serif;
|
||||
}
|
||||
.title::before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
width: 4px;
|
||||
height: 16px;
|
||||
border-radius: 1px;
|
||||
margin-right: 5px;
|
||||
background-color: #0b58ff;
|
||||
}
|
||||
.sub-title{
|
||||
font-size: 16px;
|
||||
line-height: 18px;
|
||||
color: #888686;
|
||||
min-width: 80px;
|
||||
text-align: center;
|
||||
font-weight: 500;
|
||||
margin-right: 30px;
|
||||
font-family: '微软雅黑', 'Microsoft YaHei', Arial, Helvetica, sans-serif;
|
||||
float: right;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -58,7 +58,7 @@ import {
|
||||
getWarehouseLocationHisPage,
|
||||
} from '@/api/warehouse/warehouseRealtimeLocation';
|
||||
import { listByWarehouse } from '@/api/warehouse/warehouseLocation';
|
||||
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
import { listData } from '@/api/system/dict/data';
|
||||
import { publicFormatter } from '@/utils/dict';
|
||||
|
||||
@ -179,8 +179,14 @@ export default {
|
||||
listData(queryParams).then((response) => {
|
||||
this.formConfig[2].selectOptions = response.data.list;
|
||||
});
|
||||
listByWarehouse(this.listQuery.storageType).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === this.listQuery.storageType) {
|
||||
listByWarehouse(item.id).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2023-08-21 14:26:23
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2023-11-04 14:46:59
|
||||
* @LastEditTime: 2023-11-06 11:31:14
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
@ -93,7 +93,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listByWarehouse, listAll } from '@/api/warehouse/warehouseLocation';
|
||||
import { listByWarehouse } from '@/api/warehouse/warehouseLocation';
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
@ -129,7 +130,10 @@ export default {
|
||||
there: [],
|
||||
four: [],
|
||||
}),
|
||||
listAll(1).then((response) => {
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === 4) {
|
||||
listByWarehouse(item.id).then((response) => {
|
||||
response.data.forEach((a, b) => {
|
||||
if (b % 4 === 0) {
|
||||
this.wareData.one.push(a);
|
||||
@ -142,7 +146,10 @@ export default {
|
||||
}
|
||||
});
|
||||
this.total = Math.ceil(response.data.length / 40);
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
buttonClick(val) {
|
||||
switch (val.btnName) {
|
||||
|
||||
@ -64,7 +64,7 @@ import {
|
||||
outWarehouseRealtimeLocation,
|
||||
} from '@/api/warehouse/warehouseRealtimeLocation';
|
||||
import { listByWarehouse } from '@/api/warehouse/warehouseLocation';
|
||||
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
import { listData } from '@/api/system/dict/data';
|
||||
import { publicFormatter } from '@/utils/dict';
|
||||
import { mapGetters } from 'vuex';
|
||||
@ -203,8 +203,14 @@ export default {
|
||||
listData(queryParams).then((response) => {
|
||||
this.formConfig[2].selectOptions = response.data.list;
|
||||
});
|
||||
listByWarehouse(this.listQuery.storageType).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === this.listQuery.storageType) {
|
||||
listByWarehouse(item.id).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
|
||||
@ -2,16 +2,20 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2023-08-22 15:01:54
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2023-11-04 15:18:38
|
||||
* @LastEditTime: 2023-11-07 14:11:10
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-row :gutter="10" class="chart-container">
|
||||
<el-col :span="14">
|
||||
<el-col :span="wareType === 1 ? 14 : 24">
|
||||
<div class="chart-card">
|
||||
<div class="title">库存总览</div>
|
||||
<div class="sub-title">产品总数量
|
||||
<div style="color: black;">{{ totalNum }}</div>
|
||||
</div>
|
||||
<barChart
|
||||
ref="barChart"
|
||||
height="500px"
|
||||
height="600px"
|
||||
title="库存总览"
|
||||
v-if="overviewList.length"
|
||||
:histogram="overviewList" />
|
||||
@ -19,16 +23,18 @@
|
||||
<div class="no-data-bg" v-else></div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="10">
|
||||
<el-col :span="wareType === 1 ? 10 : 0">
|
||||
<div class="chart-card">
|
||||
<div class="title">库位占用率</div>
|
||||
<pieChart
|
||||
ref="pieChart"
|
||||
height="600px"
|
||||
title="库位占用率"
|
||||
v-if="rateList.length"
|
||||
:pie-data="rateList" />
|
||||
<!-- 没有数据 -->
|
||||
<div class="no-data-bg" v-else></div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
@ -36,46 +42,62 @@
|
||||
<script>
|
||||
import barChart from '../../chart/BarChart.vue';
|
||||
import pieChart from '../../chart/PieChart.vue';
|
||||
import {
|
||||
getOverview,
|
||||
getRate,
|
||||
} from '@/api/warehouse/warehouseLocation';
|
||||
import { getOverview, getRate } from '@/api/warehouse/warehouseLocation';
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
urlOptions: {
|
||||
allURL: getOverview,
|
||||
rateURL: getRate
|
||||
rateURL: getRate,
|
||||
},
|
||||
listQuery: {
|
||||
storageType: 1,
|
||||
},
|
||||
wareType: 1,
|
||||
totalNum: 0,
|
||||
overviewList: [],
|
||||
rateList: []
|
||||
rateList: [],
|
||||
};
|
||||
},
|
||||
components: {
|
||||
barChart,
|
||||
pieChart
|
||||
pieChart,
|
||||
},
|
||||
mounted() {
|
||||
this.getDataList();
|
||||
},
|
||||
created() {
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === this.listQuery.storageType) {
|
||||
this.wareType = item.type;
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
// 获取数据列表
|
||||
getDataList() {
|
||||
const data = {
|
||||
storageType : 1
|
||||
}
|
||||
this.urlOptions.allURL(data).then((response) => {
|
||||
this.overviewList = response.data;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.barChart.initChart();
|
||||
});
|
||||
this.urlOptions.allURL(this.listQuery).then((response) => {
|
||||
if (response.data && response.data.length) {
|
||||
this.overviewList = response.data;
|
||||
this.overviewList.forEach(item=>{
|
||||
this.totalNum += item.num
|
||||
})
|
||||
this.$nextTick(() => {
|
||||
this.$refs.barChart.initChart();
|
||||
});
|
||||
}
|
||||
});
|
||||
this.urlOptions.rateURL(data).then((response) => {
|
||||
this.rateList = response.data;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.pieChart.initChart();
|
||||
});
|
||||
this.urlOptions.rateURL(this.listQuery).then((response) => {
|
||||
if (response.data && response.data.length) {
|
||||
this.rateList = response.data;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.pieChart.initChart();
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
@ -93,4 +115,33 @@ export default {
|
||||
padding: 16px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
.title {
|
||||
font-size: 18px;
|
||||
line-height: 16px;
|
||||
margin-bottom: 10px;
|
||||
color: #000;
|
||||
font-weight: 500;
|
||||
font-family: '微软雅黑', 'Microsoft YaHei', Arial, Helvetica, sans-serif;
|
||||
}
|
||||
.title::before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
width: 4px;
|
||||
height: 16px;
|
||||
border-radius: 1px;
|
||||
margin-right: 5px;
|
||||
background-color: #0b58ff;
|
||||
}
|
||||
.sub-title{
|
||||
font-size: 16px;
|
||||
line-height: 18px;
|
||||
color: #888686;
|
||||
min-width: 80px;
|
||||
text-align: center;
|
||||
font-weight: 500;
|
||||
margin-right: 30px;
|
||||
font-family: '微软雅黑', 'Microsoft YaHei', Arial, Helvetica, sans-serif;
|
||||
float: right;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -58,7 +58,7 @@ import {
|
||||
getWarehouseLocationHisPage,
|
||||
} from '@/api/warehouse/warehouseRealtimeLocation';
|
||||
import { listByWarehouse } from '@/api/warehouse/warehouseLocation';
|
||||
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
import { listData } from '@/api/system/dict/data';
|
||||
import { publicFormatter } from '@/utils/dict';
|
||||
|
||||
@ -179,8 +179,14 @@ export default {
|
||||
listData(queryParams).then((response) => {
|
||||
this.formConfig[2].selectOptions = response.data.list;
|
||||
});
|
||||
listByWarehouse(1).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === this.listQuery.storageType) {
|
||||
listByWarehouse(item.id).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2023-08-21 14:26:23
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2023-11-04 14:46:59
|
||||
* @LastEditTime: 2023-11-06 11:30:20
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
@ -93,7 +93,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listByWarehouse, listAll } from '@/api/warehouse/warehouseLocation';
|
||||
import { listByWarehouse } from '@/api/warehouse/warehouseLocation';
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
@ -129,7 +130,10 @@ export default {
|
||||
there: [],
|
||||
four: [],
|
||||
}),
|
||||
listAll(1).then((response) => {
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === 1) {
|
||||
listByWarehouse(item.id).then((response) => {
|
||||
response.data.forEach((a, b) => {
|
||||
if (b % 4 === 0) {
|
||||
this.wareData.one.push(a);
|
||||
@ -142,7 +146,10 @@ export default {
|
||||
}
|
||||
});
|
||||
this.total = Math.ceil(response.data.length / 40);
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
buttonClick(val) {
|
||||
switch (val.btnName) {
|
||||
|
||||
@ -64,7 +64,7 @@ import {
|
||||
outWarehouseRealtimeLocation,
|
||||
} from '@/api/warehouse/warehouseRealtimeLocation';
|
||||
import { listByWarehouse } from '@/api/warehouse/warehouseLocation';
|
||||
|
||||
import { getWarehouseList } from '@/api/warehouse/warehouse-info';
|
||||
import { listData } from '@/api/system/dict/data';
|
||||
import { publicFormatter } from '@/utils/dict';
|
||||
import { mapGetters } from 'vuex';
|
||||
@ -175,7 +175,7 @@ export default {
|
||||
label: '入库时间',
|
||||
dateType: 'daterange',
|
||||
format: 'yyyy-MM-dd',
|
||||
valueFormat: "timestamp",
|
||||
valueFormat: 'timestamp',
|
||||
rangeSeparator: '-',
|
||||
startPlaceholder: '开始时间',
|
||||
endPlaceholder: '结束时间',
|
||||
@ -203,8 +203,14 @@ export default {
|
||||
listData(queryParams).then((response) => {
|
||||
this.formConfig[2].selectOptions = response.data.list;
|
||||
});
|
||||
listByWarehouse(1).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
getWarehouseList().then((response) => {
|
||||
response.data.forEach((item) => {
|
||||
if (item.storageType === this.listQuery.storageType) {
|
||||
listByWarehouse(item.id).then((response) => {
|
||||
this.formConfig[0].selectOptions = response.data;
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
@ -216,7 +222,7 @@ export default {
|
||||
this.listQuery.locationId = val.name;
|
||||
this.listQuery.palletCode = val.code;
|
||||
this.listQuery.status = val.status;
|
||||
this.listQuery.inTime = val.searchTime?val.searchTime:null;
|
||||
this.listQuery.inTime = val.searchTime ? val.searchTime : null;
|
||||
this.getDataList();
|
||||
break;
|
||||
default:
|
||||
|
||||
Loading…
Reference in New Issue
Block a user