update 完成时序图模块
This commit is contained in:
parent
a505f34abc
commit
e42b7035fe
@ -16,13 +16,36 @@
|
|||||||
|
|
||||||
<div class="main-area">
|
<div class="main-area">
|
||||||
<div class="graphs" v-if="graphList.length">
|
<div class="graphs" v-if="graphList.length">
|
||||||
<div class="graph" v-for="eq,index in graphList" :key="eq.key">
|
<div class="graph" v-for="(eq, index) in graphList" :key="eq.key">
|
||||||
<h2 class="graph-title">{{ eq.key }}</h2>
|
<h2 class="graph-title">{{ eq.key }}</h2>
|
||||||
<LineChart :key="eq.key + '__linechart'" :config="getRealConfig(index)" />
|
<LineChart
|
||||||
|
:key="eq.key + '__linechart'"
|
||||||
|
:config="getRealConfig(index)" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<h2 v-else>请添加设备</h2>
|
<h2 v-else>请添加设备</h2>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- 对话框(添加 / 修改) -->
|
||||||
|
<base-dialog
|
||||||
|
dialogTitle="添加设备"
|
||||||
|
:dialogVisible="open"
|
||||||
|
width="500px"
|
||||||
|
@close="open = false"
|
||||||
|
@cancel="open = false"
|
||||||
|
@confirm="submitForm">
|
||||||
|
<el-select
|
||||||
|
v-if="open"
|
||||||
|
style="width: 100%"
|
||||||
|
v-model="queryParams.equipmentId"
|
||||||
|
placeholder="请选择一个设备">
|
||||||
|
<el-option
|
||||||
|
v-for="eq in eqList"
|
||||||
|
:key="eq.id"
|
||||||
|
:value="eq.id"
|
||||||
|
:label="eq.name"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</base-dialog>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -88,6 +111,8 @@ export default {
|
|||||||
equipmentId: null,
|
equipmentId: null,
|
||||||
recordTime: [],
|
recordTime: [],
|
||||||
},
|
},
|
||||||
|
open: false,
|
||||||
|
eqList: [],
|
||||||
graphList: [],
|
graphList: [],
|
||||||
templateConfig: {
|
templateConfig: {
|
||||||
grid: {
|
grid: {
|
||||||
@ -141,6 +166,7 @@ export default {
|
|||||||
created() {
|
created() {
|
||||||
this.initProductline();
|
this.initProductline();
|
||||||
this.initWorksection();
|
this.initWorksection();
|
||||||
|
this.initEquipment();
|
||||||
this.getList();
|
this.getList();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
@ -154,7 +180,7 @@ export default {
|
|||||||
this.getList();
|
this.getList();
|
||||||
break;
|
break;
|
||||||
case 'compare':
|
case 'compare':
|
||||||
this.$message.info('暂未实现该接口');
|
this.open = true;
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -215,7 +241,9 @@ export default {
|
|||||||
|
|
||||||
/** 获得设备产量的时间 */
|
/** 获得设备产量的时间 */
|
||||||
getTimeinfo(equipmentArr) {
|
getTimeinfo(equipmentArr) {
|
||||||
return equipmentArr.map((item) => new Date(item.startTime).toLocaleTimeString());
|
return equipmentArr.map((item) =>
|
||||||
|
new Date(item.startTime).toLocaleTimeString()
|
||||||
|
);
|
||||||
},
|
},
|
||||||
|
|
||||||
getRealConfig(index) {
|
getRealConfig(index) {
|
||||||
@ -224,11 +252,29 @@ export default {
|
|||||||
// config.legend.data = this.graphList[index].key;
|
// config.legend.data = this.graphList[index].key;
|
||||||
config.series[0].name = this.graphList[index]?.key;
|
config.series[0].name = this.graphList[index]?.key;
|
||||||
// console.log("this.graphList?.[index]", this.graphList?.[index]);
|
// console.log("this.graphList?.[index]", this.graphList?.[index]);
|
||||||
config.series[0].data = this.getEquipmentQuantity(this.graphList?.[index] || []);
|
config.series[0].data = this.getEquipmentQuantity(
|
||||||
|
this.graphList?.[index] || []
|
||||||
|
);
|
||||||
config.xAxis.data = this.getTimeinfo(this.graphList?.[index] || []);
|
config.xAxis.data = this.getTimeinfo(this.graphList?.[index] || []);
|
||||||
return config;
|
return config;
|
||||||
},
|
},
|
||||||
|
|
||||||
|
/** 准备设备数据 */
|
||||||
|
async initEquipment() {
|
||||||
|
const { code, data } = await this.$axios({
|
||||||
|
url: '/base/equipment/listAll',
|
||||||
|
method: 'get',
|
||||||
|
});
|
||||||
|
if (code == 0) {
|
||||||
|
this.eqList = data.map((item) => {
|
||||||
|
return {
|
||||||
|
name: item.name,
|
||||||
|
id: item.id,
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
/** 准备产线数据 */
|
/** 准备产线数据 */
|
||||||
async initProductline() {
|
async initProductline() {
|
||||||
const { code, data } = await this.$axios({
|
const { code, data } = await this.$axios({
|
||||||
@ -260,6 +306,23 @@ export default {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
async submitForm() {
|
||||||
|
const { code, data } = await this.$axios({
|
||||||
|
url: '/analysis/equipment-analysis/quantity',
|
||||||
|
method: 'get',
|
||||||
|
params: this.queryParams,
|
||||||
|
});
|
||||||
|
if (code == 0) {
|
||||||
|
const newEqlist = this.objectToArray(data);
|
||||||
|
if (!newEqlist || newEqlist.length == 0) {
|
||||||
|
this.$message.error('该设备没有产量数据');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.graphList.push(newEqlist[0]);
|
||||||
|
}
|
||||||
|
this.open = false;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
@ -113,6 +113,27 @@
|
|||||||
</div>
|
</div>
|
||||||
<h2 v-else>请添加设备</h2>
|
<h2 v-else>请添加设备</h2>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- 对话框(添加 / 修改) -->
|
||||||
|
<base-dialog
|
||||||
|
dialogTitle="添加设备"
|
||||||
|
:dialogVisible="open"
|
||||||
|
width="500px"
|
||||||
|
@close="open = false"
|
||||||
|
@cancel="open = false"
|
||||||
|
@confirm="submitForm">
|
||||||
|
<el-select
|
||||||
|
v-if="open"
|
||||||
|
style="width: 100%"
|
||||||
|
v-model="queryParams.equipmentId"
|
||||||
|
placeholder="请选择一个设备">
|
||||||
|
<el-option
|
||||||
|
v-for="eq in eqList"
|
||||||
|
:key="eq.id"
|
||||||
|
:value="eq.id"
|
||||||
|
:label="eq.name"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</base-dialog>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -177,6 +198,8 @@ export default {
|
|||||||
recordTime: [],
|
recordTime: [],
|
||||||
},
|
},
|
||||||
graphList: [],
|
graphList: [],
|
||||||
|
open: false,
|
||||||
|
eqList: [],
|
||||||
// demo: [
|
// demo: [
|
||||||
// [
|
// [
|
||||||
// {
|
// {
|
||||||
@ -203,6 +226,7 @@ export default {
|
|||||||
created() {
|
created() {
|
||||||
this.initProductline();
|
this.initProductline();
|
||||||
this.initWorksection();
|
this.initWorksection();
|
||||||
|
this.initEquipment();
|
||||||
this.getList();
|
this.getList();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
@ -235,6 +259,22 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
/** 准备设备数据 */
|
||||||
|
async initEquipment() {
|
||||||
|
const { code, data } = await this.$axios({
|
||||||
|
url: '/base/equipment/listAll',
|
||||||
|
method: 'get',
|
||||||
|
});
|
||||||
|
if (code == 0) {
|
||||||
|
this.eqList = data.map((item) => {
|
||||||
|
return {
|
||||||
|
name: item.name,
|
||||||
|
id: item.id,
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
/** 准备产线数据 */
|
/** 准备产线数据 */
|
||||||
async initProductline() {
|
async initProductline() {
|
||||||
const { code, data } = await this.$axios({
|
const { code, data } = await this.$axios({
|
||||||
@ -277,10 +317,27 @@ export default {
|
|||||||
this.getList();
|
this.getList();
|
||||||
break;
|
break;
|
||||||
case 'compare':
|
case 'compare':
|
||||||
this.$message.info('暂未实现该接口')
|
this.open = true;
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
async submitForm() {
|
||||||
|
const { code, data } = await this.$axios({
|
||||||
|
url: '/analysis/equipment-analysis/status',
|
||||||
|
method: 'get',
|
||||||
|
params: this.queryParams,
|
||||||
|
});
|
||||||
|
if (code == 0) {
|
||||||
|
const newEqlist = this.objectToArray(data);
|
||||||
|
if (!newEqlist || newEqlist.length == 0) {
|
||||||
|
this.$message.error('该设备没有状态数据');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.graphList.push(newEqlist[0]);
|
||||||
|
}
|
||||||
|
this.open = false;
|
||||||
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
Loading…
Reference in New Issue
Block a user