update 设备产量时序图
This commit is contained in:
parent
90695acefd
commit
fe0b5538a8
@ -24,6 +24,7 @@
|
||||
:formConfigs="searchBarFormConfig"
|
||||
ref="search-bar"
|
||||
:remove-blue="true"
|
||||
@select-changed="handleSearchBarChanged"
|
||||
@headBtnClick="handleSearchBarBtnClick" />
|
||||
</el-row>
|
||||
|
||||
@ -73,7 +74,6 @@
|
||||
|
||||
<script>
|
||||
import LineChart from './components/lineChart.vue';
|
||||
|
||||
import response from './response.json';
|
||||
|
||||
export default {
|
||||
@ -82,16 +82,7 @@ export default {
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
startTime: new Date(
|
||||
(() => {
|
||||
const date = new Date();
|
||||
date.setHours(0);
|
||||
date.setMinutes(0);
|
||||
date.setSeconds(0);
|
||||
date.setMilliseconds(0);
|
||||
return date;
|
||||
})()
|
||||
).getTime(),
|
||||
startTime: null, // new Date(2023, 8, 26, 0, 0, 0, 0).getTime(),
|
||||
accumulators: new Map(),
|
||||
searchBarFormConfig: [
|
||||
{
|
||||
@ -100,7 +91,7 @@ export default {
|
||||
placeholder: '请选择产线',
|
||||
selectOptions: [],
|
||||
param: 'lineId',
|
||||
required: true,
|
||||
onchange: true,
|
||||
},
|
||||
{
|
||||
type: 'select',
|
||||
@ -108,7 +99,6 @@ export default {
|
||||
placeholder: '请选择工段',
|
||||
selectOptions: [],
|
||||
param: 'sectionId',
|
||||
required: true,
|
||||
},
|
||||
// 时间段
|
||||
{
|
||||
@ -154,7 +144,18 @@ export default {
|
||||
eqList: [],
|
||||
graphList: [],
|
||||
templateConfig: {
|
||||
color: ['#283D68', '#FFB61F', '#4481FF', '#5AD8A6', '#E97466'],
|
||||
color: [
|
||||
'#283D68',
|
||||
'#FFB61F',
|
||||
'#4481FF',
|
||||
'#5AD8A6',
|
||||
'#E97466',
|
||||
'#ccc', //<=== 需按情况更新
|
||||
'#ccc',
|
||||
'#ccc',
|
||||
'#ccc',
|
||||
'#ccc',
|
||||
],
|
||||
grid: {
|
||||
top: 48,
|
||||
left: 48,
|
||||
@ -178,11 +179,26 @@ export default {
|
||||
show: true,
|
||||
trigger: 'axis',
|
||||
formatter: function (params) {
|
||||
// const content = ''
|
||||
// params.forEach(({ value, seriesName }) => {
|
||||
// content += `${seriesName}: ${value}\n`;
|
||||
// });
|
||||
// return content
|
||||
return `
|
||||
<div style="margin-bottom: 8px;">${new Date(
|
||||
+params[0].name
|
||||
).toLocaleTimeString()}</div>
|
||||
${params
|
||||
.map(({ seriesName, color, data }) =>
|
||||
data != null
|
||||
? `
|
||||
<div style="min-width: 160px; display: flex; justify-content: space-between; align-items: center;">
|
||||
<span style="display: flex; align-items: center;">
|
||||
<span style="display: inline-block; margin-right: 8px; width: 12px; height: 12px; background: ${color}"></span>
|
||||
<span style="">${seriesName}</span>
|
||||
</span>
|
||||
<span style="color: #c7c7c7; text-align: right;">${data}</span>
|
||||
</div>
|
||||
`
|
||||
: ''
|
||||
)
|
||||
.join('')}
|
||||
`;
|
||||
},
|
||||
},
|
||||
xAxis: null,
|
||||
@ -245,15 +261,18 @@ export default {
|
||||
this.initProductline();
|
||||
this.initWorksection();
|
||||
this.initEquipment();
|
||||
this.getList();
|
||||
},
|
||||
mounted() {
|
||||
console.log('this.startTIme', this.startTime);
|
||||
// this.getList();
|
||||
},
|
||||
methods: {
|
||||
handleSearchBarBtnClick({ btnName, ...payload }) {
|
||||
switch (btnName) {
|
||||
case 'search':
|
||||
if (!payload.recordTime || payload.recordTime.length <= 0) {
|
||||
this.$message.error('请选择时间段');
|
||||
return;
|
||||
}
|
||||
this.startTime = new Date(payload.recordTime).getTime();
|
||||
|
||||
this.queryParams.lineId = payload.lineId || null;
|
||||
this.queryParams.sectionId = payload.sectionId || null;
|
||||
this.queryParams.equipmentId = payload.equipmentId || null;
|
||||
@ -271,6 +290,18 @@ export default {
|
||||
}
|
||||
},
|
||||
|
||||
handleSearchBarChanged({ param, value }) {
|
||||
if (!value) {
|
||||
this.searchBarFormConfig[1].selectOptions = [];
|
||||
return;
|
||||
}
|
||||
switch (param) {
|
||||
case 'lineId':
|
||||
this.getWorksectionById(value);
|
||||
break;
|
||||
}
|
||||
},
|
||||
|
||||
/** 重置查询条件 */
|
||||
initQuery() {
|
||||
this.queryParams.lineId = null;
|
||||
@ -296,41 +327,19 @@ export default {
|
||||
async getList() {
|
||||
this.initState();
|
||||
|
||||
// const { code, data } = await this.$axios({
|
||||
// url: '/analysis/equipment-analysis/quantity',
|
||||
// method: 'get',
|
||||
// params: this.queryParams,
|
||||
// });
|
||||
const { code, data } = await this.$axios({
|
||||
url: '/analysis/equipment-analysis/quantity',
|
||||
method: 'get',
|
||||
params: this.queryParams,
|
||||
});
|
||||
|
||||
const { code, data } = response;
|
||||
// const { code, data } = response;
|
||||
if (code == 0) {
|
||||
this.graphList = this.objectToArray(data);
|
||||
console.log('this graphList', this.graphList);
|
||||
// const eq1 = [
|
||||
// { totalQuantity: 20, startTime: 1693964578000 },
|
||||
// { totalQuantity: 43, startTime: 1693964678000 },
|
||||
// { totalQuantity: 12, startTime: 1693964778000 },
|
||||
// { totalQuantity: 11, startTime: 1693964878000 },
|
||||
// { totalQuantity: 98, startTime: 1693965478000 },
|
||||
// { totalQuantity: 87, startTime: 1693965578000 },
|
||||
// ];
|
||||
// eq1.key = 'SS1';
|
||||
// const eq2 = [
|
||||
// { totalQuantity: 23, startTime: 1693961578000 },
|
||||
// { totalQuantity: 42, startTime: 1693964578000 },
|
||||
// { totalQuantity: 51, startTime: 1693965578000 },
|
||||
// { totalQuantity: 18, startTime: 1693966578000 },
|
||||
// { totalQuantity: 77, startTime: 1693966778000 },
|
||||
// { totalQuantity: 38, startTime: 1693967578000 },
|
||||
// { totalQuantity: 57, startTime: 1693969578000 },
|
||||
// ];
|
||||
// eq2.key = 'SS2';
|
||||
// this.graphList = [eq1, eq2];
|
||||
this.setXaxis();
|
||||
this.graphList.forEach(this.setSeries);
|
||||
} else {
|
||||
this.graphList = [];
|
||||
this.graphList.forEach(this.setSeries);
|
||||
}
|
||||
},
|
||||
|
||||
@ -346,7 +355,6 @@ export default {
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: function (value, index) {
|
||||
console.log('value', value, new Date(value));
|
||||
return new Date(+value)
|
||||
.toLocaleTimeString()
|
||||
.split(':')
|
||||
@ -362,7 +370,6 @@ export default {
|
||||
setYaxis() {},
|
||||
|
||||
setSeries(list) {
|
||||
console.log('set series');
|
||||
const data = Array(24).fill(null);
|
||||
list.map((item, index) => {
|
||||
const idx = this.timeArr.indexOf(item.startTime);
|
||||
@ -454,6 +461,25 @@ export default {
|
||||
}
|
||||
},
|
||||
|
||||
/** 根据产线获取工段 */
|
||||
async getWorksectionById(lineId) {
|
||||
const { code, data } = await this.$axios({
|
||||
url: '/base/workshop-section/listByParentId',
|
||||
method: 'get',
|
||||
params: {
|
||||
id: lineId,
|
||||
},
|
||||
});
|
||||
if (code == 0) {
|
||||
this.searchBarFormConfig[1].selectOptions = data.map((item) => {
|
||||
return {
|
||||
name: item.name,
|
||||
id: item.id,
|
||||
};
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
async submitForm() {
|
||||
const { code, data } = await this.$axios({
|
||||
url: '/analysis/equipment-analysis/quantity',
|
||||
|
||||
Loading…
Reference in New Issue
Block a user